美文网首页
TS高级类型

TS高级类型

作者: 贺贺v5 | 来源:发表于2023-01-30 15:11 被阅读0次

keyof

获取类型内所有的 key,即所有属性名 , 获取的是一个 联合类型
这里类型指:通过 interface 或 type 定义的类型;通过 typeof xxx 返回的类型等。keyof 后面必须是类型,不能是具体的对象

interface IPeople {
    name:string,
    age?: number,
    sex: string,
  }
  
  type T = keyof IPeople

  // 等同于
  type T = "name" | "age" | "sex"

in

循环类型 一般循环的是 联合类型,把联合类型中每一个属性名赋值给 P

// 使用上面的 T 类型
  type TObj =  {
    [P in keyof T]: any
  }

  // 等同于
  type TObj = {
    name: any;
    age: any;
    sex: any;
  }

typeof

ts 中 typeof 是获取数据的类型,常用用于获取 对象、数组、函数、class、枚举等类型

const people = {
    name: 'liuyz',
    age: 18,
  }
  
  type INewPeople = typeof people
  // 等同于
  // type INewPeople = {
  //   name: number
  //   age: number
  // }
  
  const newPeople: INewPeople = {
    name: "zhi",
    age: 18,
  }
  
  type TKeys = keyof typeof newPeople
  // 等同于
  // type TKeys = "name" | "age"

Pick

从 T 类型中选取部分 K 类型,并返回新的类型,这里 T 常用于对象类型

 type Pick<T, K extends keyof T> = {
      [P in K]: T[P];
  };
// keyof T 获取 T 中所有的 key 属性
//K extends keyof T K 必须继承于 keyof T ,如果 K 中的属性有不属于 keyof T 的则会报错
interface IPeople {
    name:string,
    age?: number,
    sex: string,
  }
  
  type TPick = Pick<IPeople, 'name' | 'age'>
  
  // 等同于
  type TPick = {
    name: string;
    age?: number | undefined;
  }

Partial

将T中的所有属性设置为可选

type Partial<T> = {
      [P in keyof T]?: T[P];
  };
interface IPeople {
    name:string,
    age?: number,
    sex: string,
  }
  type TPartial = Partial<IPeople>
  
  // 等同于
  type TPartial = {
    name?: string | undefined;
    age?: number | undefined;
    sex?: string | undefined;
  }

Required

使 T 中的所有属性都变成必需的

interface IPeople {
    name:string,
    age?: number,
    sex: string,
  }
  type TRequired = Required<IPeople>

  // 等同于
  type TRequired = {
    name: string;
    age: number;
    sex: string;
  }

Readonly

将 T 中的所有属性设为只读

<!-- 源码 -->
  type Readonly<T> = {
    readonly [P in keyof T]: T[P];
  }

 interface IPeople {
    name:string,
    age?: number,
    sex: string,
  }
  type TReadonly = Readonly<IPeople>

  // 等同于
  type TReadonly = {
     readonly name: string;
     readonly age?: number | undefined;
     readonly sex: string;
  }

Exclude

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

Extract

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

Omit

// 就是在 User 的基础上,去掉 id 属性
type EditUser = Omit<User,"id">; 

Pick

从类型定义的属性中,选取指定一组属性,返回一个新的类型定义。

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

NonNullable

去除 null 和 undefined 后的新类型

type TType= number | null | undefined
  type TNonNullable = NonNullable<TType>
  // 等同于
  // type TNonNullable = number

typeof

  • 自动生成对象的类型,如果对象上有类型则使用定义的类型

相关文章

  • TS高级类型:Extract 与 Exclude

    Extract 是TS提供的一个TS高级type类型【简称TS高级类型】 Extract 用于类 Extract ...

  • ts高级类型

    类型的且运算 上面的代码c变量的类型为A和B,也就是要同时满足A和B里所有的字段定义,name、age和garde...

  • TS: 高级类型

    TS 文档是有一章叫高级类型,其实并不是真的“高级”,他实际的意思是将普通的类型用“某种方式”组合起来形成一个“组...

  • TypeScript自带的工具泛型

    前言 前面总结了ts的高级类型,下面再来说说ts给我们提供的一些基于这些高级类型而成的工具泛型。 Partial ...

  • 常用TS高级类型

    类类型 写法: 应用: 函数返回类型 写法: 参数类型 写法: 应用: 类型推导infer 参考 https://...

  • ts type类型 高级类型 类型保护

    type type 关键字用来定义一种类型举个例子 交叉类型 表示将多个类型合并为一个类型,多用在混入 联合类型 ...

  • Ts高级类型(Utility Types)

    学习TypeScript的过程中发现对某些UtilityTypes不是很理解,就重新在文档上系统学习了一遍,Typ...

  • typeScript语法

    ts类型 ts联合类型使用或 ts定义任意类型any ts定义函数返回值的类型 ts中的类定义 interface接口

  • TS学习笔记(八):高级类型

    交叉类型 交叉类型将多个类型合并为一个类型,相当于新类型具有这多个类型的所有特性,相当于是一种并的操作,通常在使用...

  • 【进阶】TS高级类型,泛型

    # 类型别名 type 类型别名就是给已有的类型取一个新名字,并不会新建类型 类型别名:可以用于原始值,联合类型,...

网友评论

      本文标题:TS高级类型

      本文链接:https://www.haomeiwen.com/subject/rnkjcdtx.html