共计 1471 个字符,预计需要花费 4 分钟才能阅读完成。
keyof 用来返回一个 class 类型或者 interface 类型的所有 key 组成的联结类型。能够看上面的一个例子:
一:当把 keyof 用在个别常见的 class 类型和 interface 类型上
type Point = {0: number; height: number};
interface Point2{name: string; age: number}
type KeyOfPoint = keyof Point; // 0 | 'height'
type KeyOfPoint2 = keyof Point2; // 'name' | 'age'
const fn = (key: KeyOfPoint | KeyOfPoint2)=>{}
fn(0) //no error
fn('height') //no error
fn('name') //no error
fn('age') //no error
fn('width') // error: 类型不匹配
在以上的代码外面 :
key: KeyOfPoint | KeyOfPoint2
就相当于:
key: 0 | 'height' | 'name' | 'age'
所以,当咱们调用:fn('width')
的时候就会报错,因为‘width’不在 Point 和 Point2 的 key 的列表外面。
二:当把 keyof 用在 index signature 的 class 类型上时
number 类型的 index signature, 后果为:number
type Arrayish = {[n: number]: unknown };
type A = keyof Arrayish; // type A = number
string 类型的 index signature,后果为:string | number
。这是因为,当我定义 string 类型的 index signature 时,我仍然能够给 number 类型的 key,因为 JavaScript 会把对象的 number 类型的 key 强制转为 string,比方 obj[0]和 obj[‘0’]是相等的。
type Arrayish = {[n: string]: unknown };
type A = keyof Arrayish; // type A = number | number
const fn = (key: A)=>{}
fn('xxx') // no error
fn(0) // no error
以上是 keyof 的通常应用场景,也是 keyof 被设计进去的初衷。然而,如果咱们把 keyof 用到 enum,number,string 等类型上会失去什么呢?
三:当把 keyof 用在 number 类型的 enum 上
enum Colors {
red,
blue,
yellow
}
type A = keyof Colors; // "toString" | "toFixed" | "toExponential" | "toPrecision" | "valueOf" | "toLocaleString"
当把 keyof 用在 number 类型的 enum 上时,会失去 Number.prototype
上所定义的办法的名字(string 格局)的联结类型。
四:当把 keyof 用在 string 类型的 enum 上
enum Colors {
red = 'red',
blue = 'blue',
yellow = 'yellow'
}
type A = keyof Colors; // number | "toString" | "charAt" | "charCodeAt" | "concat" | ...27 more... | "padEnd"
当把 keyof 用在 string 类型的 enum 上时,咱们就失去一个由 number 类型再加上 String.prototype 上定义的所有的办法的名字组成的一个联结类型。
正文完
发表至: typescript
2021-04-27