TypeScript 类型注解:高级类型详细解析
2023-11-04 05:39:33
在编写 TypeScript 代码时,使用类型注解可以帮助我们更好地理解代码的意图,并防止出现类型错误。TypeScript 中的类型注解分为基本类型和高级类型两类,基本类型包括字符串、数字、布尔值、数组、元组、枚举和未知类型,而高级类型则包括联合类型、交叉类型、keyof T、T[K]、索引类型、映射类型、条件类型、类型保护和泛型。
联合类型
联合类型允许一个变量可以同时存储多个不同类型的な値。联合类型的语法是使用 |
将多个类型连接起来,比如:
let x: string | number;
这个代码表示变量 x
可以存储字符串或数字。
交叉类型
交叉类型允许我们创建新的类型,该类型包含多个其他类型的特征。交叉类型的语法是使用 &
将多个类型连接起来,比如:
interface Person {
name: string;
}
interface Employee extends Person {
employeeId: number;
}
这个代码创建了一个新的类型 Employee
,它包含了 Person
类型的所有特征,还增加了 employeeId
属性。
keyof T
keyof T
操作符返回类型 T
的属性名的联合类型。比如:
interface Person {
name: string;
age: number;
}
type PersonKeys = keyof Person;
这个代码定义了一个类型 PersonKeys
,它包含了 Person
类型的所有属性名,即 "name"
和 "age"
。
T[K]
T[K]
操作符返回类型 T
的属性 K
的类型。比如:
interface Person {
name: string;
age: number;
}
type NameType = Person["name"];
这个代码定义了一个类型 NameType
,它包含了 Person
类型属性 name
的类型,即 string
。
索引类型
索引类型允许我们创建新的类型,该类型表示对象的索引签名。索引类型的语法是使用 []:
来指定索引的类型,比如:
interface Person {
[index: string]: any;
}
这个代码创建了一个新的类型 Person
,它允许我们使用字符串作为索引来访问对象中的属性。
映射类型
映射类型允许我们创建新的类型,该类型表示对象的每个属性的类型。映射类型的语法是使用 {[key: string]: type}
来指定映射的键和值类型,比如:
type Person = {
[key: string]: any;
};
这个代码创建了一个新的类型 Person
,它允许我们使用字符串作为键来访问对象中的属性,并且这些属性的类型都是 any
。
条件类型
条件类型允许我们创建新的类型,该类型取决于另一个类型的真假值。条件类型的语法是使用 extends
和 ?
来指定条件,比如:
type IsString<T> = T extends string ? true : false;
这个代码定义了一个条件类型 IsString
,它可以判断一个类型是否为字符串。
类型保护
类型保护是指我们可以使用某种方法来检查一个变量的类型。TypeScript 提供了两种类型保护:类型别名和类型谓词。
类型别名允许我们创建一个新的类型,该类型表示另一个类型的子类型。比如:
type StringType = string;
这个代码定义了一个新的类型 StringType
,它表示字符串类型的子类型。
类型谓词允许我们创建一个函数,该函数可以判断一个变量是否属于某种类型。比如:
function isString(x: any): x is string {
return typeof x === "string";
}
这个函数可以判断一个变量 x
是否为字符串。
泛型
泛型允许我们创建可重用的组件,这些组件可以用于不同类型的数据。泛型的语法是使用尖括号 <>
来指定类型参数,比如:
function identity<T>(x: T): T {
return x;
}
这个函数可以接受任何类型的数据,并返回相同类型的数据。
以上是对 TypeScript 类型注解中高级类型的一些介绍。这些类型可以帮助我们更好地理解代码的意图,防止出现类型错误,并提高代码的可重用性。