TS 泛型

泛型工具

typeOf

在类型上下文中获取变量或者属性的类型

interface ManType {
    age: number
}
const man: ManType = {
    age: 10
}

type NewManType = typeof man;
const newMan: NewManType = {
    age: 10
}

keyof

获取某种类型的所有键，返回联合类型

interface ManType {
    age: number,
    name: string
}

type ManTypeKey = keyof ManType;

const man: ManTypeKey = 'age' // OK

实战

type Todo = {
  age: number;
  name: string;
  sex: string;
}

const todo: Todo = {
  age: 1,
  name: "remons",
  sex: 'man'
}
// 限制 T 为传入的 object 类型的子类型, K 为 T 的所有 key
function prop<T extends object, K extends keyof T>(obj: T, key: K) {
  return obj[key];
}

const age = prop(todo, "age");
const nickName = prop(todo, "name");
const sex = prop(todo, "sex");

console.log({ age, nickName, sex })

in

遍历枚举类型

type A = 'a' | 'b' | 'c'

type Obj = {
    [a in A]: string
}

const b: Obj = {
    a: 'a',
    b: 'b',
    c: 'c'
}

extends

interface Lengthwise {
  length: number;
}

function loggingIdentity<T extends Lengthwise>(arg: T): T {
  console.log(arg.length);
  return arg;
}

loggingIdentity({length: 10, value: 3});
// 对传入的 T 进行约束，上面的例子中，T 必须含有 Lengthwise 类型，即 T = Lengthwise & {[propsName]: any}

infer

// infer 用来推断
type Obj<T> = T extends {a: infer VType, b: infer VType} ? VType : number;

let obj1: Obj<string>; // => number
// VType： 我要是什么类型才可以满足传入的 string 呢，{a: infer VType, b: infer VType} 不可以从 string 继承，满足不了

let obj2: Obj<true>; // => number
// VType： 我要是什么类型才可以满足传入的 true 呢，{a: infer VType, b: infer VType} 不可以从 true 继承，满足不了

let obj3: Obj<{a: number, b: string}>; // => number | string
// VType： 我要是什么类型才可以满足传入的 {a: number, b: string} 呢，{a: infer VType, b: infer VType} ,如果我是 number | string 就可以了

let obj4: Obj<{a: number, b: () => void}>; // => number | () => void
// VType： 我要是什么类型才可以满足传入的 {a: number, b: () => void} 呢，{a: infer VType, b: infer VType} ,如果我是 number | () => void 就可以了


// 例子2:
type Func<T> = T extends () => infer R ? R : boolean;

let func1: Func<number>; // => boolean
// R: 我要是什么类型才可以满足传入的 number 呢，() => infer R 无法继承自 number

let func2: Func<''>; // => boolean
// R: 我要是什么类型才可以满足传入的 '' 呢，() => infer R 无法继承自 ''

let func3: Func<() => Promise<number>>; // => Promise<number>
// R: 我要是什么类型才可以满足传入的 () => Promise<number> 呢，我是 Promise<number> 就可以了


// 例子3:
type ReturnType<T> = T extends (...args: any[]) => infer R ? R : any;

type func = () => number;
type variable = string;
type funcReturnType = ReturnType<func>;
// R：我要是什么类型才可以满足传入的 () => number 呢，(...args: any[]) => infer R ， R => number

type varReturnType = ReturnType<variable>;
// 我要是什么类型才可以满足传入的 string 呢，好像满足不了， R => any

映射类型

interface Test {
    name: string,
    age: number
}

type Test2 <T> = {
    [p in keyof T]+?: T[p]
}

type Test3 = Test2<Test>
// type Test3 = {
//     name?: string | undefined;
//     age?: number | undefined;
// }

Partial

变为可选，但无法处理多层

• 实现

  type Partial<T> = {
    [P in keyof T]?: T[P];
  };
  

• 示例

  interface Test {
      name: string,
      age: number
  }
  
  type Test2 = Partial<Test>
  // type Test2 = {
  //     name?: string | undefined;
  //     age?: number | undefined;
  // }
  

Required

变为必选， 同上，无法处理多层

• 实现

  type Required<T> = { 
      [P in keyof T]-?: T[P] 
  };
  

• 示例

  interface Test {
      name?: string,
      age?: number
  }
  
  type Test2 = Required<Test>
  // type Test2 = {
  //     name: string;
  //     age: number;
  // }
  

Readonly

变为只读

• 实现

  type Readonly<T> = {
      readonly [p in keyof T]: T[p];
  }
  

Pick

从中挑选一些

• 实现

  type Pick<T, K extends keyof T> = {
      [P in K]: T[P];
  };
  

• 示例

  interface Test {
      name?: string,
      age?: number
  }
  
  type Test2 = Pick<Test, 'name'>
  // type Test2 = {
  //     name?: string | undefined;
  // }
  

Record

将 K 中所有的属性的值转化为 T 类型

• 实现

  type Record<K extends keyof any, T> = {
      [P in K]: T;
  };
  

• 示例

  interface User {
      title: string;
  }
  
  type Page = "age" | "name";
  
  type Test = Record<Page, User> 
  // type Test = {
  //     age: User;
  //     name: User;
  // }
  

ReturnType

得到一个函数的返回值类型

• 实现

  type ReturnType<T extends (...args: any[]) => any> = T extends (
    ...args: any[]
  ) => infer R
    ? R
    : any;
  

• 示例

  type Func = (value: number) => string;
  type Test = ReturnType<Func>;
  // type Test = string
  

Exclude

将某个类型中属于另一个的类型移除掉(差集)

• 实现

  type Exclude<T, U> = T extends U ? never : T;
  

• 示例

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

Extract

从 T 中提取出 U (交集)

• 实现

  type Extract<T, U> = T extends U ? T : never;
  

• 示例

  type T0 = Extract<number | string | boolean, number | string>;
  // type T0 = string | number
  type T1 = Extract<string | number | (() => void), Function>; // () =>void
  

Omit

• 实现

  type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>;
  

• 示例

  interface Todo {
    title: string;
    description: string;
    completed: boolean;
  }
  
  type TodoPreview = Omit<Todo, "description">;
  // type TodoPreview = {
  //     title: string;
  //     completed: boolean;
  // }
  

NonNullable

过滤类型中的 null 及 undefined

• 实现

  type NonNullable<T> = T extendsnull | undefined ? never : T;
  

• 示例

  type Test = undefined | string | boolean;
  
  type Test2 = NonNullable<Test>
  

Parameters

获得函数的参数类型组成的元组类型

• 实现

  type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never;
  

• 示例

  type Test = Parameters<(a: string, v: string) => void>;
  // type Test = [a: string, v: string]