🤪🤪TS高级用法（三）

如今，越来越多的项目使用了TypeScript进行编写，我们都知道TypeScript是JavaScript的超集，它为JavaScript提供了强大的类型和语法增强功能，能在项目开发的过程中大大减少错误的产生。而TypeScript也内置了很多的工具类型，接下来，我将带着大家学习TypeScript中的工具类型。

本文中为系列文章的第三篇

NonNullable

NonNullable用于将类型中的null，undefined属性移除掉。

栗子

// type NonNullable<T> = T extends null ? never : T
type stringType=NonNullable<string|undefined|null>
// type stringType = string

分析

如果T类型可以被分配给null返回never，否则返回T。

type NonNullable<T> = T extends null ? never : T

Parameters

Parameters用于获取函数的参数类型。

栗子

export default function fun1(x: number, y: number, z: number) {
  console.log(x, y, z);
  return { x, y, z };
}
​
type p1=Parameters<(name:number)=>void>
// type p1 = [name: number]
​
type p2=Parameters<<T>(arg:T)=>T>
// type p2 = [arg: unknown]
​
// 获取fun1函数的参数类型
type p3=Parameters<typeof fun1>
// [x: number, y: number, z: number]
​
// 分析
// type Parameters<T extends (...args: any) => any> = T extends (...args: infer P) => any ? P : never

分析

T类型通过infer关键字进行推断P函数参数类型。

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

ConstructorParameters

ConstructorParameters用户获取一个构造函数的参数类型。

栗子

class Person {
  name: string;
  age: number;
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }
}
​
type PT=ConstructorParameters<typeof Person>
// type PT = [name: string, age: number]
​
type ET =ConstructorParameters<ErrorConstructor>
// type ET = [message?: string]
​
type NT =ConstructorParameters<null>
// type NT = unknown[]
​
type AT =ConstructorParameters<any>
// type AT = unknown[]

分析

type ConstructorParameters<T extends abstract new (...args: any) => any> = T extends abstract new (...args: infer P) => any ? P : never

ReturnType

ReturnType用于获取一个函数的返回值类型。

栗子

function f1(name: string): string {
  return name;
}
​
type f1Type = ReturnType<typeof f1>;
// type f1Type = string
​
function f2<T>(name: T): T {
  return name;
}
​
type f2Type = ReturnType<typeof f2>;
// type f2Type = unknown
​

分析

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