【前端】【Ts】TypeScript的关键知识点

  • 一、知识点总结

    • (一)void 与 never 的区别

      • (1) void:声明函数无返回值,但可以走到 return 行。
      • (2) never:表示函数不会走到 return 行,常用于抛异常或无限循环。
    • (二)字面量类型与联合类型的使用

      • (1) 利用字面量类型和联合类型(使用 “|” 连接多个可能值)实现类似枚举的效果。
      • (2) 限制变量只能取特定范围内的值。
    • (三)interface 接口的使用

      • (1) 用于分离类型声明,提高代码的重用性和可读性。
      • (2) 对函数的控制写法:可以通过接口来约束函数的参数和返回值类型。
        • // 对函数的控制写法
          interface SumFunction {
            (a: number, b: number): number;
          }
          const sum: SumFunction = function (a: number, b: number): number {
            return a + b;
          }
          
      • (3) 对数组的接口控制:通过接口限制数组的索引和对应值的类型。
        • interface MyArray {
            [index: number]: string;  // 限制索引对应的值为 string 类型
          }
          // 使用示例
          let myArr: MyArray = ["a", "34"];
          myArr[3] = "asdf";
          // myArr["3"] = "cs"  // 错误:索引必须为数字类型
          
      • (4) 单继承和多继承:接口可以通过 extends 关键字实现单继承或多继承。
        • interface A extends B, C {
            // 接口内容
          }
          
    • (四)keyof 的使用

      • (1) 用于获取某个类型的所有键,返回一个联合类型。
      • (2) 用法示例
        • 安全获取对象属性:
          interface MyObject {
            number: string;
            name: string;
            age: number;
          }
          const myObj: MyObject = {
            number: '28324',
            name: 'xiaoming',
            age: 23
          }
          function getProp(object: MyObject, props: keyof MyObject) {
            return object[props];
          }
          // 等价于限定 props 只能为 'number' | 'name' | 'age'
          
      • (3) 也可以用于实现类型映射,将一个类型中的所有属性转化为另一种形式。
    • (五)元组与数组

      • (1) 元组:长度固定,每个元素类型可以单独设置。
        • const arr: [number, string] = [23, 'nihao'];
          
      • (2) 数组:长度不固定,但所有元素类型必须一致。
        • const arr: number[] = [3, 34, 66];
          
    • (六)any 与 unknown 的区别

      • (1) any:具有赋值污染效应,赋值给其他类型时不会报错,但缺乏类型安全提示。
      • (2) unknown:不会发生赋值污染,需要先进行类型断言或检查后才能赋值,保障类型安全。
    • (七)避免 unknown 赋值报错

      • (1) 可使用 as 进行类型断言,将 unknown 类型转换为具体类型。
      • (2) 也可使用其他类型转换方法确保赋值的安全性。
    • (八)枚举类型

      • (1) 用于定义一组固定的常量,限制变量的取值范围。
      • (2) 枚举成员既可以通过名称,也可以通过对应的数字访问。
        • enum Direction {
            North,
            East,
            South,
            West
          }
          const myDirection: Direction = Direction.North;
          // 或者直接赋值数字
          const myDirection2: Direction = 0;
          
  • 二、详细解析与总结

    • (一)关于 void 与 never

      • (1) void 类型:主要用于标注函数无返回值,但函数内部仍可能存在 return 语句,只是不返回任何值。
      • (2) never 类型:表明函数执行过程中不会正常结束,比如抛出错误或者进入无限循环,因而不会到达 return 语句。
    • (二)字面量类型与联合类型的灵活应用

      • (1) 可以通过限定变量的取值范围,避免传入不合法的值,提升代码的健壮性。
      • (2) 当多个固定值组合使用时,联合类型为代码提供了更高的灵活性和可读性。
    • (三)interface 的多重应用

      • (1) 对象类型定义:通过 interface 分离类型声明,使代码结构更清晰。
      • (2) 函数与数组控制:利用接口可以精确控制函数的参数、返回值以及数组中索引和值的类型。
      • (3) 继承机制:支持单继承和多继承,有效复用已有类型定义,减少代码重复。
    • (四)keyof 的深入使用

      • (1) 通过 keyof 可以动态获取对象的所有键,极大地增强了类型安全性和灵活性。
      • (2) 在类型映射和安全获取对象属性时,keyof 都发挥着重要作用。
    • (五)元组与数组的特点比较

      • (1) 元组:适用于固定长度和固定类型顺序的数据集合。
      • (2) 数组:适用于长度不定但类型一致的数据集合。
    • (六)any 与 unknown 的取舍

      • (1) any:使用时较为宽松,但可能会引发潜在的类型安全问题。
      • (2) unknown:需要进行明确的类型判断或断言,更适合在追求严格类型安全的场景下使用。
    • (七)如何避免 unknown 类型带来的赋值问题

      • (1) 使用类型断言(as)明确告知编译器变量实际类型,从而避免报错。
      • (2) 通过合理的类型检查,确保变量转换过程中的安全性。
    • (八)枚举类型的实际应用

      • (1) 枚举可以将一组相关的常量组织在一起,提高代码可读性和维护性。
      • (2) 枚举成员既能通过名称引用,也能通过对应的数值访问,提供了灵活的使用方式。
  • 三、总结

    • 以上笔记涵盖了 TypeScript 中几种重要的类型和概念,从函数返回值的 void 与 never 区别,到字面量类型、联合类型以及接口的应用,再到 keyof、元组、数组、any 与 unknown 的区别,以及枚举类型的使用。
    • 理解并熟练运用这些知识点,有助于在编写 TypeScript 代码时实现更严格的类型检查,提高代码的健壮性和可维护性。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/965113.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

“message“: “类型注释只能在 TypeScript 文件中使用

VScode中使用CtrlShiftP打开搜素框,输入Preferences: Open User Settings或Preferences: Open Workspace Settings。 找到settings.json文件 "typescript.validate.enable": false

VSCode中使用EmmyLua插件对Unity的tolua断点调试

一.VSCode中搜索安装EmmyLua插件 二.创建和编辑launch.json文件 初始的launch.json是这样的 手动编辑加上一段内容如下图所示: 三.启动调试模式,并选择附加的进程

SQL 秒变三线表 sql导出三线表

🎯SQL 秒变三线表,校园小助手超神啦 宝子们,搞数据分析、写论文的时候,从 SQL 里导出数据做成三线表是不是特别让人头疼😩 手动调整格式,不仅繁琐,还容易出错,分分钟把人逼疯&#…

学习threejs,pvr格式图片文件贴图

👨‍⚕️ 主页: gis分享者 👨‍⚕️ 感谢各位大佬 点赞👍 收藏⭐ 留言📝 加关注✅! 👨‍⚕️ 收录于专栏:threejs gis工程师 文章目录 一、🍀前言1.1 ☘️PVR贴图1.2 ☘️THREE.Mesh…

力扣1022. 从根到叶的二进制数之和(二叉树的遍历思想解决)

Problem: 1022. 从根到叶的二进制数之和 文章目录 题目描述思路复杂度Code 题目描述 思路 遍历思想(利用二叉树的先序遍历) 1.在先序遍历的过程中,用一个变量path记录并更新其经过的路径上的值,当遇到根节点时再将其加到结果值res上; 2.该题…

.NET 中实现生产者-消费者模型,BlockingCollection<T> 和 Channel<T>使用示例

一、方案对比&#xff1a;不同线程安全集合的适用场景 二、推荐方案及示例代码 方案 1&#xff1a;使用 BlockingCollection&#xff08;同步模型&#xff09; public class QueueDemo {private readonly BlockingCollection<int> _blockingCollection new BlockingCo…

C_位运算符及其在单片机寄存器的操作

C语言的位运算符用于直接操作二进制位&#xff0c;本篇简单结束各个位运算符的作业及其在操作寄存器的应用场景。 一、位运算符的简单说明 1、按位与运算符&#xff08;&&#xff09; 功能&#xff1a;按位与运算符对两个操作数的每一位执行与操作。如果两个对应的二进制…

Redis入门概述

1.1、Redis是什么 Redis&#xff1a;官网 高性能带有数据结构的Key-Value内存数据库 Remote Dictionary Server&#xff08;远程字典服务器&#xff09;是完全开源的&#xff0c;使用ANSIC语言编写遵守BSD协议&#xff0c;例如String、Hash、List、Set、SortedSet等等。数据…

个人毕业设计--基于HarmonyOS的旅行助手APP的设计与实现(挖坑)

在行业混了短短几年&#xff0c;却总感觉越混越迷茫&#xff0c;趁着还有心情学习&#xff0c;把当初API9 的毕业设计项目改成API13的项目。先占个坑&#xff0c;把当初毕业设计的文案搬过来 摘要&#xff1a;HarmonyOS&#xff08;鸿蒙系统&#xff09;是华为公司推出的面向全…

C++11详解(二) -- 引用折叠和完美转发

文章目录 2. 右值引用和移动语义2.6 类型分类&#xff08;实践中没什么用&#xff09;2.7 引用折叠2.8 完美转发2.9 引用折叠和完美转发的实例 2. 右值引用和移动语义 2.6 类型分类&#xff08;实践中没什么用&#xff09; C11以后&#xff0c;进一步对类型进行了划分&#x…

车载以太网__传输层

车载以太网中&#xff0c;传输层和实际用的互联网相差无几。本篇文章对传输层中的IP进行介绍 目录 什么是IP&#xff1f; IP和MAC的关系 IP地址分类 私有IP NAT DHCP 为什么要防火墙穿透&#xff1f; 广播 本地广播 直接广播 本地广播VS直接广播 组播 …

大数据学习之Spark分布式计算框架RDD、内核进阶

一.RDD 28.RDD_为什么需要RDD 29.RDD_定义 30.RDD_五大特性总述 31.RDD_五大特性1 32.RDD_五大特性2 33.RDD_五大特性3 34.RDD_五大特性4 35.RDD_五大特性5 36.RDD_五大特性总结 37.RDD_创建概述 38.RDD_并行化创建 演示代码&#xff1a; // 获取当前 RDD 的分区数 Since ( …

第一性原理:游戏开发成本的思考

利润 营收-成本 营收定价x销量x分成比例 销量 曝光量x 点击率x &#xff08;购买率- 退款率&#xff09; 分成比例 100%- 平台抽成- 税- 引擎费- 发行抽成 成本开发成本运营成本 开发成本 人工外包办公地点租金水电设备折旧 人工成本设计成本开发成本迭代修改成本后续内容…

MLA 架构

注&#xff1a;本文为 “MLA 架构” 相关文章合辑。 未整理去重。 DeepSeek 的 MLA 架构 原创 老彭坚持 产品经理修炼之道 2025 年 01 月 28 日 10:15 江西 DeepSeek 的 MLA&#xff08;Multi-head Latent Attention&#xff0c;多头潜在注意力&#xff09;架构 是一种优化…

数据结构-堆和PriorityQueue

1.堆&#xff08;Heap&#xff09; 1.1堆的概念 堆是一种非常重要的数据结构&#xff0c;通常被实现为一种特殊的完全二叉树 如果有一个关键码的集合K{k0,k1,k2,...,kn-1}&#xff0c;把它所有的元素按照完全二叉树的顺序存储在一个一维数组中&#xff0c;如果满足ki<k2i…

BUUCTF_[安洵杯 2019]easy_web(preg_match绕过/MD5强碰撞绕过/代码审计)

打开靶场&#xff0c;出现下面的静态html页面&#xff0c;也没有找到什么有价值的信息。 查看页面源代码 在url里发现了img传参还有cmd 求img参数 这里先从img传参入手&#xff0c;这里我发现img传参好像是base64的样子 进行解码&#xff0c;解码之后还像是base64的样子再次进…

Linux的简单使用和部署4asszaaa0

一.部署 1 环境搭建方式主要有四种: 1. 直接安装在物理机上.但是Linux桌面使用起来非常不友好.所以不建议.[不推荐]. 2. 使用虚拟机软件,将Linux搭建在虚拟机上.但是由于当前的虚拟机软件(如VMWare之类的)存在⼀些bug,会导致环境上出现各种莫名其妙的问题比较折腾.[非常不推荐…

RK3566-移植5.10内核Ubuntu22.04

说明 记录了本人使用泰山派&#xff08;RK3566&#xff09;作为平台并且成功移植5.10.160版本kernel和ubuntu22.04&#xff0c;并且成功配置&连接网络的完整过程。 本文章所用ubuntu下载地址&#xff1a;ubuntu-cdimage-ubuntu-base-releases-22.04-release安装包下载_开源…

二级C语言题解:十进制转其他进制、非素数求和、重复数统计

目录 一、程序填空&#x1f4dd; --- 十进制转其他进制 题目&#x1f4c3; 分析&#x1f9d0; 二、程序修改&#x1f6e0;️ --- 非素数求和 题目&#x1f4c3; 分析&#x1f9d0; 三、程序设计&#x1f4bb; --- 重复数统计 题目&#x1f4c3; 分析&#x1f9d0; 前言…

UE求职Demo开发日志#22 显示人物信息,完善装备的穿脱

1 创建一个人物信息显示的面板&#xff0c;方便测试 简单弄一下&#xff1a; UpdateInfo函数&#xff1a; 就是获取ASC后用属性更新&#xff0c;就不细看了 2 实现思路 在操作目标为装备栏&#xff0c;或者操作起点为装备栏时&#xff0c;交换前先判断能否交换&#xff08;只…