typescript的高阶用法Partial&Pick

41 阅读1分钟

Partial

1.内部实现
type Partial<T> {
    [key in keyof T]?: T[key]
}

// 上述源码传入一个实例范型可以转换为
type Person {
   name: string,
   age: number,
   sex: number
} 
let p = Partial<Person>

则 p的内部type变为
type p = {
    name?: string | undefined,
    age?: number | undefined,
    sex?: number
}


2.本质:
通过上述代码,可以理解为本质就是一个type容器,这个type容器能将所有的参数转为可选的类型。


3. 业务场景
如果一开始我们都不了解哪些参数是必须要的,那么我们就可以使用Partial

Pick

1.内部实现以及例子

截屏2022-10-23 下午10.36.49.png

则 p内部的type变为 
type p = {
    name: string,
    age: number
}

2.本质
我们可以了解到本质就是将我们定义的范型Person容器内的部分属性过滤出来,一个缩减版的Person 

3.Pick的业务场景,若我们定义了一个Person的容器,我们只需要一部分,那就拿一部分出来

Record

1.内部实现源码 
// 此处的any只能允许 number string , symbol
type Record<K keyof any,T> {
    [p in K]: T
}

套用一个例子

// 定义容器对象
type Person {
    name: string,
    age: number
}

// 定义属性
type key = 'obj1' | 'obj2' | 'obj3'

type p = Record<key,Person>

// 赋值
const p1: p = {
    obj1: {name:'张三',age:22},
    obj2: {name:'张三',age:22},
    obj3: {name:'张三',age:22},  
}

2.本质
通过上述例子,我们可以了解到,Record定义的容器,是对象嵌套对象,每个内部对象的外层key名可以进行限制。
3.业务场景
    模糊: 可以用来定义对象嵌套对象的情况,暂时没有遇到很融洽的例子