这是我参与「第四届青训营 」笔记创作活动的的第9天，整理一下之前课上关于 TypeScript 的相关内容。
一、本节课主要内容
- 数据类型，包含基础数据类型、对象类型、函数类型、泛型等
- 高级数据类型，包含联合类型、工具类型等
二、详细知识点介绍
1. 数据类型
- 基础数据类型：
string、number、boolean、null、undefined - 对象类型
interface Person {
name: string
sex: "male" | "female"
age: number
}
- 函数类型：
(x: number, y: number) => number
若在接口中定义函数类型，则为
(x: number, y: number): number
- 数组类型：
number[]或Array<string | number>- 元组表示：
[number, string, string, number] - 接口表示：
[key: number]: any（属性名为数字的对象即可以看作是数组）
- 补充类型
- 空类型：
void - 任意类型：
any - 枚举类型：
enum
- 空类型：
- 泛型
- 泛型约束：
<T extends string> - 泛型参数默认类型：
<T = number>（不显式指定类型时为number）
- 泛型约束：
- 类型别名：
type MyType = string | number - 类型断言：
a as number - 字面量：
type Tag = "div" | "span"（只允许指定字符串/数字作为固定值）
2. 高级类型
- 联合/交叉类型：
type UnionType = Type1 & Type2（UnionType中包含了Type1和Type2中所有类型的特性） - 类型保护与类型守卫
- 函数的返回值为一个类型谓词，如
arg is A，可以在子作用域中明确arg的类型为A - 用
typeof和instanceof可以用来判断数据类型
- 函数的返回值为一个类型谓词，如
- 工具类型：
Partical<Type>：将Type中的所有属性设置为可选，可以理解为该类型是Type类型的子集Required<Type>：与Partical相反，将所有属性设置为必选Readonly<Type>：将所有属性设置为readonlyRecord<KeyType, ValueType>：将KeyType映射到ValueType上，构造出由一个键值对组成的类型Pick<Type, Keys>：从Type中挑选部分属性Keys来构造出一个新的类型（具体看后面的例子）Omit<Type, Keys>：与Pick相反，去除Keys指定的属性后构造出一个新的类型Extract<Type1, Type2>：从类型Type1中提取出所有可以赋值给Type2的类型后构造出一个新的类型Exclude<Type1, Type2>：与Extract相反Parameters<Type>：使用函数类型Type的参数的类型构造出一个元组类型ReturnType<Type>：函数类型Type的返回值的类型InstanceType<Type>：构造函数类型Type的实例类型
interface Person {
name: string
sex: "male" | "female"
age: number
id: string
}
type Student = Pick<Person, "name" | "sex" | "age">
const student = {
name: "vii",
sex: "male",
age: 20,
}
- 索引类型
type Keys = keyof { a: string; b: number }即type Keys = "a" | "b"in关键字：表示取值可能是字面量的其中一种可能
三、个人课后总结
这节课老师主要讲解的是 TypeScript 中的数据类型。相较于 JS 的动态类型，TS 的静态类型提供了很好的类型检查，在很大程度上能避免数据类型带来的程序错误。然而 TS 中的数据类型也是十分复杂的，如工具类型就提供了许多种根据已有类型构造出一个新的类型的方法。想要深入掌握 TS ，对于数据类型的理解是十分重要且必要的，这一部分需要花大量的时间进行实践。
