乐趣区

关于typescript:TypeScript常用工具类型OmitPickPartialRequiredExclude-Extract

TS 中罕用的工具映射类型, 让写 TS 时效率大大晋升, 防止无意义的重复性定义。

1.Omit 省略 / 剔除

顾名思义 能够剔除 已定义对象中 本人不须要的一部分造成新的定义类型。

interface UserObj {
    readonly name: string; // readonly 只读属性 只能初始化定义 不能二次赋值
    age: number;
    id: number;
    sex: 0 | 1;
    address: string;
    weight: number;
}

// 剔除省略本人不须要的
type Person = Omit<Person, "number" | "sex"  | "address" | "weight">;

// 此时 Person 等同于 Person1

interface Person1 {
    readonly name: string;
    id: number;
}

// Omit 的源码
type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;

2.Pick 采集

顾名思义,能够采集 已定义对象中 本人须要的一部分造成新的定义类型。

interface UserObj {
    readonly name: string;
    age: number;
    id: number;
    sex: 0 | 1;
    address: string;
    weight: number;
 }
 
 // 采集须要的
 type Person = Pick<UserObj, "name" | "id">;
 
 // 此时 Person 等同于 Person1
 interface Person1 {
     readonly name: string;
     id: number;
}
// Pick 的源码
type Pick<T, K extends keyof T> = {[P in K]: T[P];
};

3.Partial

可把定义好的对象(蕴含 必选 + 可选项)类型全副转化为 可选项

// 已有定义类型 Person
interface Person {
    name: string;
    age: number;
    id: number;
    sex: 0 | 1;
    address: string;
    weight: number;
}

// 应用办法
const newObj: Partial<Person> = {name: '张三' // 如果只须要一项 Partial 的便捷性 能够不须要从新定义类型};

// Partial<Person> 等同于 NewPerson
interface NewPerson {
    name?: string;
    age?: number;
    id?: number;
    sex?: 0 | 1;
    address?: string;
    weight?: number;
}
Partial 的源码, 非常简单, 本人就能够实现一个简易版
type Partial<T> = {[P in keyof T]?: T[P];
};

4.Required (必选的)

Required 和 Partial 刚好相同, 可把定义好的对象(蕴含 必选 + 可选项)类型全副转化为 必选项

// 已有定义类型 Person
interface Person {
    name: string;
    age: number;
    id?: number;
    sex?: 0 | 1;
}

// 应用办法
const newObj: Required<Person> = {
    name: '张三',
    age: 1,
    id: 1,
    sex: 1
};

// Required<Person> 等同于 NewPerson
interface NewPerson {
    name: string;
    age: number;
    id: number;
    sex: 0 | 1;
}
Required 的源码实现也非常简单,”-?” 意思是移除可选属性
/**
 * Make all properties in T required
 */
type Required<T> = {[P in keyof T]-?: T[P];
};

5.Readonly (转化只读)

Readonly 就是为类型对象每一项增加前缀 Readonly

interface Person {
    readonly name: string; // 只有这一项有 readonly
    age: number;
    id?: number;
}

// 应用办法
const newObj: Readonly<Person> = {
    name: '张三',
    age: 1,
    id: 1
};
// newObj.name = '李四'; // 异样 因为有 readonly 只读属性,只能初始化申明,不能赋值。// Readonly<Person> 等同于 NewPerson
interface NewPerson {
    readonly name: string;
    readonly age: number;
    readonly id?: number;
}
Readonly 的源码实现也非常简单
/**
 * Make all properties in T readonly
 */
type Readonly<T> = {readonly [P in keyof T]: T[P];
};

6.Extract (提取 / 包含)

// Extract 实现源码 原理很简略
type Extract<T, U> = T extends U ? T : never;
interface Person {name: string;}

interface NewPerson {
    name: string;
    age: number;
    id: number;
}

// 案例 1
//  NewPerson 如果 extends 继承 Person(继承了 Person 的属性),就返回 NewPerson,否则就 never 异样
const obj: Extract<NewPerson, Person> = {
    name: '',
    age: 1,
    id: 1
}

Extract<NewPerson, Person> 此时就等同于 NewPerson

7.Exclude (排除 / 不包含)

和 Extract 正好相同

// Exclude 源码
type Exclude<T, U> = T extends U ? never : T;
interface Person {name: string;}

interface NewPerson {
    name: string;
    age: number;
    id: number;
}

// 案例 1
// Person 如果 extends 继承 NewPerson(继承了 NewPerson 的属性),就 never 异样,否则就返回 Person
const obj: Exclude<Person, NewPerson> = {name: ''}

Exclude<Person, NewPerson> 此时就等同于 Person

未完待续,有空再增加一些不罕用的内置映射工具类和 自定义工具类

退出移动版