typescript学习-工具类型总结

总结关于typescript的一些内置工具类型的使用

1. Awaited<Type>

Awaited泛型参数Type一般用于接收一个Promise类型。

• 使用方式：

  type A = Awaited<Promise<string>>; //string
  type B = Awaited<Promise<Promise<number>>>; // number
  type C = Awaited<boolean | Promise<number>>; // boolean | number
  

2. Partial<Type>

Partial将在泛型参数Type的属性上增加可选修饰?。

• 使用方式

  interface Todo {
    title: string;
    description: string;
  }
  type OpTodo = Partial<Todo>
  // type OpTodo = {
  //   title?: string | undefined;
  //   description?: string | undefined;
  // }
  

3. Required<Type>

Required将在泛型参数Type的属性上取消可选修饰?

• 使用方式

  interface Todo {
    title?: string;
    description?: string;
  }
  type MustTodo = Required<Todo>
  // type MustTodo = {
  //   title: string;
  //   description: string;
  // }
  

4. Readonly<Type>

Required将在泛型参数Type的属性上增加只读修饰readonly

• 使用方式

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

5. Record<Keys, Type>

Record声明一个键值映射类型，一般用作于Map。

• 使用说明

  interface Todo {}
  type StrMap = Record<string,Todo>
  type NumMap = Record<number,Todo>
  type MixMap = Record<'spec' | number,Todo>
  let mix:MixMap = {
    spec:{},
    1:{}
  }
  

6. Pick<Type, Keys>

Pick将根据联合类型Keys提取Type的相应属性，组成新的类型。

• 使用方式

  interface Todo {
    title:string,
    des:string
  }
  type PickTodo = Pick<Todo,'des'>
  

7. Omit<Type, Keys>

Omit将根据联合类型Keys移除Type的相应属性，组成新的类型。

• 使用方式

  interface Todo {
    title:string,
    des:string
  }
  type OmitTodo = Omit<Todo,"title">
  

8. Exclude<UnionType, ExcludedMembers>

Exclude将根从联合类型UnionType中移除ExcludedMembers中的成员，组成新的类型。

• 使用方式

  interface Todo {
    title:string,
    des:string
  }
  type ExTodo = Exclude<keyof Todo,'title'>
  // type ExTodo = "des"
  

9. Extract<Type, Union>

Extract将从类型Type中提取出满足联合类型Union的约束的类型，并组成新的类型。

• 使用方式

  type T0 = Extract<"a" | "b" | "c", "a" | "f">;
  // type T0 = "a"
  type T1 = Extract<string | number | (() => void), Function>;
  // type T1 = () => void
  

10. NonNullable<Type>

NonNullable将从类型Type中移除null和undefined类型。

• 使用方式

  type A = null | undefined | 'first'
  type B = NonNullable<A>
  // type B = "first"
  

11. Parameters<Type>

Parameters将从方法类型Type中提取出入参的类型列表，并组成元组类型。

• 使用方式

  function A(a:string,b:boolean,c:symbol){}
  type Type = Parameters<typeof A>
  // type Type = [a: string, b: boolean, c: symbol]
  

12. ConstructorParameters<Type>

ConstructorParameters将从构造方法类型Type中提取出入参的类型列表，并组成元组类型。

• 使用方式

  class A {
    constructor(a:string,b:boolean){
    }
  }
  type Type = ConstructorParameters<typeof A>
  // type Type = [a: string, b: boolean]
  

13. ReturnType<Type>

ReturnType将从方法类型Type中自动推断返回类型。

• 使用方式

  function A(a:string,b:boolean,c:symbol):string{
    return ''
  }
  type Type = ReturnType<typeof A>
  // type Type = string
  

14. InstanceType<Type>

InstanceType将根据构造函数，获取其返回值类型。

• 使用方式

  class A {
  }
  type B = InstanceType<typeof A>
  // type B = InstanceType<new () => A>
  // type B = A
  

15. ThisParameterType<Type>

ThisParameterType将根据函数类型Type，获取this参数类型。

• 使用方式

  class Todo {}
  function A(this:Todo){
  }
  type B = ThisParameterType<typeof A>
  // type B = Todo
  

16. OmitThisParameter<Type>

OmitThisParameter将移除函数类型Type上的this类型参数。

• 使用方式

  class Todo {}
  function A(this:Todo,num:number){
  }
  type B = OmitThisParameter<typeof A>
  // type B = (num: number) => void
  

17. ThisType<Type>

ThisType是一个特殊类型，其定义在d.ts文件上是一个空接口。它不返回任何新的类型，类似于打了一个标记，用于约束在某个类型的对象上下文中，其this指针的类型。

• 使用方式

  type A = {
    x:number
  }
  type B = {
    y:number
    do:()=>void
  }&ThisType<A> // 约束B类型的对象的方法属性在执行时，其this是A类型。
  
  let fn:B = {
    y:1,
    do() {
      console.log(this.x) // 其this是A类型
    },
  }