TypeScript 映射类型
TypeScript 会将一些好用的工具类型纳入基准库中,方便开发者直接使用,本节介绍的映射类型就是这样的工具类型。
对这种工具类型,我们不只要知道使用,还要了解其实现的本质。本节我们会从源码进行分析,逐步掌握。
映射类型可以将已知类型的每个都变为可选的或者只读的。
先来看这样任务:将 Person 接口的每个都变为可选或者只读。
interface Person{
name: string
age: number
}
type PersonOptional @H__49@= Partial@H__49@<Person@H__49@>
type PersonReadonly @H__49@= Readonly@H__49@<Person@H__49@>
解释:
第 6 行,通过 Partial<Person>
这样的语法格式得到类型别名 PersonOptional
,等价于:
type PersonOptional @H__49@= {
name@H__49@?: string
age@H__49@?: number
}
第 7 行,通过 Readonly<Person>
这样的语法格式得到类型别名 PersonReadonly
,等价于:
type PersonReadonly @H__49@= {
readonly name: string
readonly age: number
}
来看它们的实现源码:
type Readonly@H__49@<T@H__49@> @H__49@= {
readonly [K in keyof T]: T[K]
}
type Partial@H__49@<T@H__49@> @H__49@= {
[K in keyof T]@H__49@?: T[K]
}
源码就使用了映射类型的语法 [K in Keys]
,来看这个语法的两个部分:
我们可以使用 for...in
来理解,它可以遍历目标对象的。
接下来继续分析:
已知了这些信息,我们就得到了将对象所有变为可选的:
[K in keyof T]@H__49@?: T[K]
进而可得:
type Partial@H__49@<T@H__49@> @H__49@= {
[K in keyof T]@H__49@?: T[K]
}
Readonly<T>
和 Partial<T>
都有着广泛的用途,因此它们与 Pick
一同被包含进了 TypeScript 的标准库里:
type Pick@H__49@<T, K extends keyof T@H__49@> @H__49@= {
[P in K]: T[P]
}
interface User {
id: number
age: number
name: string
}
type PickUser @H__49@= Pick@H__49@<User, 'id'@H__49@>
解释:
最后一行,就相当于 type PickUser = { id: number }
。
映射类型的语法是 [K in Keys]
,比较简单,但是由此我们分析了几个 TypeScript 标准库中好用的工具类型。TypeScript 中工具类型有很多,感兴趣的同学可以深入了解一下。