持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第17天，点击查看活动详情

keyof

参考文章：TypeScript: Documentation - Keyof Type Operator (typescriptlang.org)

释义

keyof 该操作符可以用于获取某种类型的所有键，对一个对象类型使用 keyof 操作符，会返回该对象属性名组成的一个字符串或者数字字面量的联合。这个例子中类型 k1 就等于 "name" | "age"

type Person = { name: string; age: number; } 
type K1 = keyof Person; // "name" | "age" 
type K2 = keyof { [x: string]: Person }; // string | number

需要注意的是 k2 是 string | number，这是因为类型{ [x: string]: Person } 具有一个string类型的索引签名，JavaScript 对象的属性名会被强制转为一个字符串，所以 obj[0] 和 obj["0"] 是一样的。

示例

如果想要获取一个对象给定属性名的值，为此，我们需要确保我们不会获取 obj 上不存在的属性。所以我们在两个类型之间建立一个约束

function getProp<T extends object, K extends keyof T>(obj:T, key:K){ 
    return obj[key]; 
}

const person = {
    name:'张三',
    age: 18
}

getProp(person,'name') // 张三
getProp(person,'phone') // TS 编译时会报错，因为 phone 不是person 的属性。 

Partial

释义

Partial类型,用于把一个类型的成员属性设置为成可选模式

Partial <T>

Constructs a type with all properties of Type set to optional. This utility will return a type that represents all subsets of a given type.

构造一个类型，将type的所有属性设置为可选。这个实用程序将返回一个表示给定类型的所有子集的类型。

源码

/**
 * Make all properties in T optional
 */
type Partial<T> = {
  [P in keyof T]?: T[P];
};

在以上代码中，首先通过 keyof T 拿到 T 的所有属性名，然后使用 in 进行遍历，将值赋给 P，最后通过 T[P] 取得相应的属性值。中间的 ? 号，用于将所有属性变为可选。

示例

interface Todo {

title: string;

description: string;

}

type PartialTodo = Partial<Todo>

利用 Partial<Todo> 将Todo的属性转换为可选属性,即 PartialTodo 的类型定义为：

{ 
    title?: string | undefined; 

    description?: string | undefined; 
    
}

拓展

TS 除了提供了 Partial 用于将对象中所有所有属性变成可选属性外，还提供了，Readonly 用于将所有属性变成只读属性。