工具列表
- [√]
Partial<Type>
- [√]
Required<Type>
- [√]
Readonly<Type>
- [√]
Record<Keys, Type>
- [√]
Pick<Type, Keys>
- [√]
Omit<Type, Keys>
- [√]
Exclude<UnionType, ExcludedMembers>
- [√]
Extract<Type, Union>
- [√]
NonNullable<Type>
- [√]
Parameters<Type>
- [√]
ConstructorParameters<Type>
- [√]
ReturnType<Type>
- [√]
InstanceType<Type>
- [√]
ThisParameterType<Type>
- [√]
OmitThisParameter<Type>
- [√]
ThisType<Type>
- [√]
Uppercase<StringType>
- [√]
Lowercase<StringType>
- [√]
Capitalize<StringType>
- [√]
Uncapitalize<StringType>
Utility Types
Partial<Type>
- 将接口类型中定义的属性变成可选的(Optional)
- 源码实现
type Partial<T> = { [P in keyof T]?: T[P] | undefined; }
- 例子
interface Todo { title: string; description: string; } function updateTodo(todo: Todo, fieldsToUpdate: Partial<Todo>) { return { ...todo, ...fieldsToUpdate }; } const todo1 = { title: "organize desk", description: "clear clutter", }; const todo2 = updateTodo(todo1, { description: "throw out trash", });
Required<Type>
- 将接口类型中定义的属性变成必选项,与
Partial<Type>
相反 - 即使在之前先将它们设为可选的,Required也会使所有符合条件的属性成为必需的,如果省略掉属性的话TypeScript将会引发错误
- 源码实现
type Required<T> = { [P in keyof T]-?: T[P]; }
- 例子
interface Props { a?: number; b?: string; } const obj: Props = { a: 5 }; const obj2: Required<Props> = { a: 5 }; // Property 'b' is missing in type '{ a: number; }' but required in type 'Required<Props>'.
Readonly<Type>
- 所有属性设置为只读的类型,不能给类型的属性重新赋值
- 源码实现
type Readonly<T> = { readonly [P in keyof T]: T[P]; }
- 例子
interface Todo { title: string; } const todo: Readonly<Todo> = { title: "Delete inactive users", }; todo.title = "Hello"; // Cannot assign to 'title' because it is a read-only property.
Record<Keys, Type>
用于生成以联合类型为键名(Keys),键值类型为Type的新接口,即把Keys的每个键值拿出来,类型规定为Type
接收两个泛型参数,构造一个对象类型,键为keys,值为type,用于将一个类型的属性映射到另一个类型
源码实现
type Record<K extends string | number | symbol, T> = { [P in K]: T; }
例子
interface CatInfo { age: number; breed: string; } type CatName = "miffy" | "boris" | "mordred"; const cats: Record<CatName, CatInfo> = { miffy: { age: 10, breed: "Persian" }, boris: { age: 5, breed: "Maine Coon" }, mordred: { age: 16, breed: "British Shorthair" }, }; cats.boris;
Pick<Type, Keys>
- 选择一组属性Keys来构造类型Type,即从对象中挑选部分
- 源码实现
type Pick<T, K extends keyof T> = { [P in K]: T[P]; }
- 例子
interface Todo { title: string; description: string; completed: boolean; } type TodoPreview = Pick<Todo, "title" | "completed">; const todo: TodoPreview = { title: "Clean room", completed: false, };
Omit<Type, Keys>
- Omit与Pick相反,它从类型Type中删除属性Keys,即是排除部分
- 源码实现
type Omit<T, K extends string | number | symbol> = { [P in Exclude<keyof T, K>]: T[P]; }
- 例子
interface Todo { title: string; description: string; completed: boolean; createdAt: number; } type TodoPreview = Omit<Todo, "description">; const todo: TodoPreview = { title: "Clean room", completed: false, createdAt: 1615544252770, }; type TodoInfo = Omit<Todo, "completed" | "createdAt">; const todoInfo: TodoInfo = { title: "Pick up kids", description: "Kindergarten closes at 5pm", };
Exclude<UnionType, ExcludedMembers>
- 从UnionType(待筛选列表)中剔除ExcludedMembers(筛选条件)的所有属性
- 源码实现
type Exclude<T, U> = T extends U ? never : T
- 例子
type T0 = Exclude<"a" | "b" | "c", "a">; // type T0 = "b" | "c" type T1 = Exclude<"a" | "b" | "c", "a" | "b">; // type T1 = "c" type T2 = Exclude<string | number | (() => void), Function>; // type T2 = string | number
Extract<Type, Union>
- Extract与Exclude相反,从Type(待筛选列表)中保留Union(筛选条件)的所有属性,Union不存在的属性全部剔除
- 源码实现
type Extract<T, U> = T extends U ? T : never
- 例子
type T0 = Extract<"a" | "b" | "c", "a" | "f">; // type T0 = "a" type T1 = Extract<string | number | (() => void), Function>; // type T1 = () => void
NonNullable<Type>
- 从Type中排除null和undefined
- 源码实现
type NonNullable<T> = T extends null | undefined ? never : T
- 例子
type T0 = NonNullable<string | number | undefined>; // type T0 = string | number type T1 = NonNullable<string[] | null | undefined>; // type T1 = string[]
Parameters<Type>
- 以元组的方式获得函数的入参Type的类型
- 源码实现
type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never
- 例子
declare function f1(arg: { a: number; b: string }): void; type T0 = Parameters<() => string>; // type T0 = [] type T1 = Parameters<(s: string) => void>; // type T1 = [s: string] type T2 = Parameters<<T>(arg: T) => T>; // type T2 = [arg: unknown] type T3 = Parameters<typeof f1>; // type T3 = [arg: { // a: number; // b: string; // }] type T4 = Parameters<any>; // type T4 = unknown[] type T5 = Parameters<never>; // type T5 = never type T6 = Parameters<string>; // Type 'string' does not satisfy the constraint '(...args: any) => any'. // type T6 = never type T7 = Parameters<Function>; // Type 'Function' does not satisfy the constraint '(...args: any) => any'. // Type 'Function' provides no match for the signature '(...args: any): any'. // type T7 = never
ConstructorParameters<Type>
- 以元组的方式获得构造函数的入参Type的类型
- 源码实现
type ConstructorParameters<T extends abstract new (...args: any) => any> = T extends abstract new (...args: infer P) => any ? P : never
- 例子
type T0 = ConstructorParameters<ErrorConstructor>; // type T0 = [message?: string] type T1 = ConstructorParameters<FunctionConstructor>; // type T1 = string[] type T2 = ConstructorParameters<RegExpConstructor>; // type T2 = [pattern: string | RegExp, flags?: string] type T3 = ConstructorParameters<any>; // type T3 = unknown[] type T4 = ConstructorParameters<Function>; // Type 'Function' does not satisfy the constraint 'abstract new (...args: any) => any'. // Type 'Function' provides no match for the signature 'new (...args: any): any'. // type T4 = never
ReturnType<Type>
- 用于获取函数的返回类型
- 源码实现
type ReturnType<T extends (...args: any) => any> = T extends (...args: any) => infer R ? R : any
- 例子
declare function f1(): { a: number; b: string }; type T0 = ReturnType<() => string>; // type T0 = string type T1 = ReturnType<(s: string) => void>; // type T1 = void type T2 = ReturnType<<T>() => T>; // type T2 = unknown type T3 = ReturnType<<T extends U, U extends number[]>() => T>; // type T3 = number[] type T4 = ReturnType<typeof f1>; // type T4 = { // a: number; // b: string; // } type T5 = ReturnType<any>; // type T5 = any type T6 = ReturnType<never>; // type T6 = never type T7 = ReturnType<string>; // Type 'string' does not satisfy the constraint '(...args: any) => any'. // type T7 = any type T8 = ReturnType<Function>; // Type 'Function' does not satisfy the constraint '(...args: any) => any'. // Type 'Function' provides no match for the signature '(...args: any): any'. // type T8 = any
InstanceType<Type>
- 推断/获得构造函数返回值的类型
- 源码实现
type InstanceType<T extends abstract new (...args: any) => any> = T extends abstract new (...args: any) => infer R ? R : any
- 例子
class C { x = 0; y = 0; } type T0 = InstanceType<typeof C>; // type T0 = C type T1 = InstanceType<any>; // type T1 = any type T2 = InstanceType<never>; // type T2 = never type T3 = InstanceType<string>; // Type 'string' does not satisfy the constraint 'abstract new (...args: any) => any'. // type T3 = any type T4 = InstanceType<Function>; // Type 'Function' does not satisfy the constraint 'abstract new (...args: any) => any'. // Type 'Function' provides no match for the signature 'new (...args: any): any'. // type T4 = any
ThisParameterType<Type>
- 提取函数Type的this参数生成一个新的Type,若函数类型并没有此参数,则提取为unknown类型。
- 源码实现
type ThisParameterType<T> = T extends (this: infer U, ...args: never) => any ? U : unknown
- 例子
function toHex(this: Number) { return this.toString(16); } function numberToString(n: ThisParameterType<typeof toHex>) { return toHex.apply(n); }
OmitThisParameter<Type>
- 创建一个OmitThisParameter类型,从函数类型Type中移除this参数,即忽略函数Type的this参数,生成一个新的函数Type
- 源码实现
type OmitThisParameter<T> = unknown extends ThisParameterType<T> ? T : T extends (...args: infer A) => infer R ? (...args: A) => R : T
- 例子
function toHex(this: Number) { return this.toString(16); } const fiveToHex: OmitThisParameter<typeof toHex> = toHex.bind(5); console.log(fiveToHex());
ThisType<Type>
- ThisType不返回转换后的类型,只是给对象标记this接口。注意,要使用ThisType,必须启用noImplicitThis
- 源码实现
interface ThisType<T>
- 例子
type ObjectDescriptor<D, M> = { data?: D; methods?: M & ThisType<D & M>; // Type of 'this' in methods is D & M }; function makeObject<D, M>(desc: ObjectDescriptor<D, M>): D & M { let data: object = desc.data || {}; let methods: object = desc.methods || {}; return { ...data, ...methods } as D & M; } let obj = makeObject({ data: { x: 0, y: 0 }, methods: { moveBy(dx: number, dy: number) { this.x += dx; // Strongly typed this this.y += dy; // Strongly typed this }, }, }); obj.x = 10; obj.y = 20; obj.moveBy(5, 5);
Intrinsic String Manipulation Types
TypeScript的一些类型可以用于字符操作,这些类型处于性能的考虑被内置在编译器中,你不能在.d.ts文件里找到它们。如:
Uppercase<StringType>
、Lowercase<StringType>
、Capitalize<StringType>
、Uncapitalize<StringType>
、Uppercase<StringType>
- 把每个字符转为大写形式
- 源码实现
type Uppercase<S extends string> = intrinsic
- 例子
type Greeting = "Hello, world" type ShoutyGreeting = Uppercase<Greeting> // type ShoutyGreeting = "HELLO, WORLD" type ASCIICacheKey<Str extends string> = `ID-${Uppercase<Str>}` type MainID = ASCIICacheKey<"my_app"> // type MainID = "ID-MY_APP"
Lowercase<StringType>
- 把每个字符转为小写形式
- 源码实现
type Lowercase<S extends string> = intrinsic
- 例子
type Greeting = "Hello, world" type QuietGreeting = Lowercase<Greeting> // type QuietGreeting = "hello, world" type ASCIICacheKey<Str extends string> = `id-${Lowercase<Str>}` type MainID = ASCIICacheKey<"MY_APP"> // type MainID = "id-my_app"
Capitalize<StringType>
- 把字符串的第一个字符转为大写形式
- 源码实现
type Capitalize<S extends string> = intrinsic
- 例子
type LowercaseGreeting = "hello, world"; type Greeting = Capitalize<LowercaseGreeting>; // type Greeting = "Hello, world"
Uncapitalize<StringType>
- 把字符串的第一个字符转换为小写形式
- 源码实现
type Uncapitalize<S extends string> = intrinsic
- 例子
type UppercaseGreeting = "HELLO WORLD"; type UncomfortableGreeting = Uncapitalize<UppercaseGreeting>; // type UncomfortableGreeting = "hELLO WORLD"
工具分类一览
- 全量修饰接口:
Partial
Readonly(Immutable)
Mutable
Required
- 裁剪接口:
Pick
Omit
PickByValueType
OmitByValueType
- 基于 infer:
ReturnType`` ParamType
PromiseType
- 获取指定条件字段:
FunctionKeys
OptionalKeys
RequiredKeys
- 内置字符操作类型:
Uppercase<StringType>
Lowercase<StringType>
Capitalize<StringType>
Uncapitalize<StringType>