TypeScript 常用工具类型

内置工具类型

1. Partial<T>

将类型 T 的所有属性变为可选

interface User { id: number; name: string; }
type PartialUser = Partial<User>; // { id?: number; name?: string; }

2. Required<T>

将类型 T 的所有属性变为必需

interface Config { debug?: boolean; verbose?: boolean; }
type RequiredConfig = Required<Config>; // { debug: boolean; verbose: boolean; }

3. Readonly<T>

将类型 T 的所有属性设为只读

interface Todo { title: string; }
type ReadonlyTodo = Readonly<Todo>; // { readonly title: string; }

4. Record<K, T>

构造一个类型，其属性名的类型为 K，属性值的类型为 T

type UserRoles = Record<string, string>; // { [key: string]: string }
type PageConfig = Record<'home' | 'about' | 'contact', { title: string }>;

5. Omit<T, K>

从类型 T 中剔除 K 中的所有属性

interface User { id: number; name: string; email: string; }
type UserWithoutEmail = Omit<User, 'email'>; // { id: number; name: string; }

6. Exclude<T, U>

从类型 T 中排除可以赋值给类型 U 的类型

type T = string | number | boolean;
type StringOrNumber = Exclude<T, boolean>; // string | number

7. Extract<T, U>

从类型 T 中提取可以赋值给类型 U 的类型

type T = string | number | boolean;
type StringOnly = Extract<T, string>; // string

8. NonNullable<T>

从类型 T 中排除 null 和 undefined

type T = string | null | undefined;
type NonNullableT = NonNullable<T>; // string

9. Parameters<T>

获取函数类型 T 的参数类型

function greet(name: string, age: number): void {}
type GreetParams = Parameters<typeof greet>; // [string, number]

10. ReturnType<T>

获取函数类型 T 的返回类型

function createUser() { return { id: 1, name: 'John' }; }
type User = ReturnType<typeof createUser>; // { id: number; name: string; }

11. InstanceType<T>

获取构造函数类型 T 的实例类型

class Person { name: string; }
type PersonInstance = InstanceType<typeof Person>; // Person

12. ThisParameterType<T>

提取函数类型 T 的 this 参数类型

function hello(this: { name: string }) { return `Hello, ${this.name}`; }
type HelloThis = ThisParameterType<typeof hello>; // { name: string }

13. Uppercase<T>, Lowercase<T>, Capitalize<T>, Uncapitalize<T>

用于字符串字面量类型的大小写转换

type Upper = Uppercase<'hello'>; // "HELLO"
type Lower = Lowercase<'HELLO'>; // "hello"
type Cap = Capitalize<'hello'>; // "Hello"
type Uncap = Uncapitalize<'Hello'>; // "hello"

常用自定义工具类型

1. DeepPartial<T>

递归地将类型 T 的所有属性变为可选

type DeepPartial<T> = T extends object ? { [P in keyof T]?: DeepPartial<T[P]>; } : T;

2. DeepReadonly<T>

递归地将类型 T 的所有属性设为只读

type DeepReadonly<T> = { readonly [P in keyof T]: DeepReadonly<T[P]>; };

3. Nullable<T>

将类型 T 的所有属性变为可以是 null

type Nullable<T> = { [P in keyof T]: T[P] | null; };

4. PickByValueType<T, U>

根据值的类型选择对象的属性

type PickByValueType<T, U> = Pick<T, { [K in keyof T]: T[K] extends U ? K : never }[keyof T]>;

5. OmitByValueType<T, U>

根据值的类型剔除对象的属性

type OmitByValueType<T, U> = Pick<T, { [K in keyof T]: T[K] extends U ? never : K }[keyof T]>;

类型操作符

1. keyof - 获取对象类型的所有键的联合类型
2. typeof - 获取变量或属性的类型
3. 索引访问类型 - 使用 T[K] 获取属性类型
4. 条件类型 - 使用 T extends U ? X : Y 进行条件类型判断
5. 映射类型 - 使用 { [K in keyof T]: ... } 转换对象类型的每个属性
6. 模板字面量类型 - 使用模板字符串创建新的字符串字面量类型

这些工具类型和类型操作符是 TypeScript 类型系统的强大武器，可以帮助你更灵活地处理复杂的类型关系，减少类型定义的重复，并提高代码的类型安全性和可维护性。