简介
TypeScript
提供一些工具类型来帮助常见的类型转换,这些类型是全局可用。在使用时我们可以直接调用。
Exclude<T, U> 从 T 可分配给的类型中排除 U
可以简单理解为排除一个联合类型中的某些类型。
type Exclude<T, U> = T extends U ? never : T;
使用
type E1 = Exclude<string | number, string>; // 排除string剩下number
所以E
就是number
let e: E1 = 10; // 这里的E就是number类型
当然它也是支持排除多个的
type E5 = Exclude<string | number | boolean, string | boolean>; // 排除string和boolean剩下number
Extract<T,U> 从 T 可分配给的类型中提取 U
可以简单理解为提取一个联合类型中的某些类型。
type Extract<T, U> = T extends U ? T : never;
使用
type E2 = Extract<string | number, string>; // 提取string
所以E
就是string
let e: E2 = "1"; // 这里的E就是string类型
当然它也是支持提取多个的
type E6 = Extract<string | number | boolean, string | boolean>; // 提取string和boolean
NonNullable 从 T 中排除 null
和 undefined
可以简单理解为踢出一个联合类型中的null
和 undefined
。
type NonNullable<T> = T extends null | undefined ? never : T;
使用
type E3 = NonNullable<string | number | null | undefined>;
所以E
就是string | number
let e1: E3 = 1;
let e2: E3 = '1';
ReturnType 表示在 extends
条件语句中待推断的类型变量
该工具类型主要是获取函数类型的返回值类型。
type ReturnType<T extends (...args: any[]) => any> = T extends (
...args: any[]
) => infer R
? R
: any;
使用
function getUserInfo() {
return { name: "randy", age: 24 };
}
// 通过 ReturnType 将 getUserInfo 的返回值类型赋给了 E4
type E4 = ReturnType<typeof getUserInfo>;
const userA: E4 = {
name: "hello",
age: 10,
};
Parameters 获取函数类型的参数类型
type Parameters<T> = T extends (...args: infer R) => any ? R : any;
使用
type T0 = Parameters<() => string>; // []
type T1 = Parameters<(s: string) => void>; // [string]
type T2 = Parameters<<T>(arg: T) => T>; // [unknown]
Partial 可以将传入的属性由必选变为可选
type Partial<T> = { [P in keyof T]?: T[P] };
使用
interface A {
a1: string;
a2: number;
a3: boolean;
}
type aPartial = Partial<A>;
const a: aPartial = {}; // 不会报错
Required 可以将传入的属性中的可选项变为必选项,这里用了 -? 修饰符来实现。
type Required<T> = { [P in keyof T]-?: T[P] };
使用
interface Person {
name: string;
age: number;
gender?: "male" | "female";
}
type p = Required<Person>
const person: p = {
name: 'randy',
age: 24,
gender: 'male'
}
Readonly 通过为传入的属性每一项都加上 readonly 修饰符来实现。
type Readonly<T> = { readonly [P in keyof T]: T[P] };
使用
interface Person {
name: string;
age: number;
gender?: "male" | "female";
}
type p2 = Readonly<Person>;
const person4: p2 = {
name: "randy",
age: 24,
};
person4.name = "demi"; // error
Pick<T, K> 能够帮助我们从传入的属性中摘取某些返回
type Pick<T, K extends keyof T> = { [P in K]: T[P] };
使用
interface Todo {
title: string;
description: string;
done: boolean;
}
type TodoBase = Pick<Todo, "title" | "done">;
const todo1: TodoBase = {
title: "todo1",
done: true,
};
Record<K, T> 构造一个类型,该类型具有一组属性 K,每个属性的类型为 T。
可用于将一个类型的属性映射为另一个类型。Record
后面的泛型就是对象键和值的类型。
简单理解:K
对应对象的 key
,T
对应对象的 value
,返回的就是一个声明好的对象 但是 K
对应的泛型约束是keyof any
也就意味着只能传入 string|number|symbol
type Record<K extends keyof any, T> = {[P in K]: T;};
使用
type Point = "x" | "y";
type PointList = Record<Point, { value: number }>;
可以看到PointList
的key
是"x" | "y"
,value
是{ value: number }
const cars: PointList = {
x: { value: 10 },
y: { value: 20 },
};
Omit<K, T> 基于已经声明的类型进行属性剔除获得新类型
type Omit=Pick<T,Exclude<keyof T,K>>
使用
type User8 = {
id: string;
name: string;
email: string;
};
type UserWithoutEmail = Omit<User8, "email">; // UserWithoutEmail ={id: string;name: string;}
我们可以看到,UserWithoutEmail
把emial
踢出了。
const user9: UserWithoutEmail = {
id: "1",
name: "randy",
};
infer
infer
是工具类型和底层库中非常常用的关键字,表示在 extends
条件语句中待推断的类型变量。
这个概念可能看不太懂,下面笔者举个例子就明白了。
假如想在获取数组里的元素类型,在不会infer
之前我是这样做的:
type Ids = number[];
type Names = string[];
type Unpacked<T> = T extends Names ? string : T extends Ids ? number : T;
type idType = Unpacked<Ids>; // idType 类型为 number
type nameType = Unpacked<Names>; // nameType 类型为string
然而如果使用infer
,会变得十分简单。
type ElementOf<T> = T extends Array<infer E> ? E : T;
type Tuple = string[];
type TupleToUnion = ElementOf<Tuple>; // string
type TupleToUnion2 = ElementOf<number[]>; // number
如果T
是某个待推断类型的数组,则返回推断的类型,否则返回T
。
系列文章
TypeScript入门之类型推断、类型断言、双重断言、非空断言、确定赋值断言、类型守卫、类型别名
后记
感谢小伙伴们的耐心观看,本文为笔者个人学习笔记,如有谬误,还请告知,万分感谢!如果本文对你有所帮助,还请点个关注点个赞~,您的支持是笔者不断更新的动力!