代码先锋网 代码片段及技术文章聚合

联合类型

/* 首先是联合类型的介绍 */
let a: string | number = '123' // 变量a的类型既可以是string，也可以是number
a = 123

Partial (意思是部分的; 不完全的)，ts中就是让一个定义中的所有属性都变成可选参数

// 定义一个Person接口
interface Person {
  name: string
  age: number
}

// 但是我们有可能数据是请求过来的，刚开始我们需要定义一个空对象，如下。
const person1: Person = {}
/**
  但是这样就加粗样式会出现报错，类型“{}”缺少类型“Person”中的以下属性: name, age。
  可能我们可以更改定义方式如下，但是有的时候我们不想破坏事先的定义，或者不能破坏
  interface Person {
    name?: string
    age?: number
  }
*/

/**
  那这个时候我们就可以用到typescript自带的高级类型 Partial，就相当于将上方接口所有属性变成可选的
  将我们需要定义的类型当做泛型传入Partial中，那么就相当于当前的类型里面的所有属性都是可选的
 */
const person2: Partial<Person> = {} // 可以
const person3: Partial<Person> = { name: 'xiaodu' } // 可以
const person4: Partial<Person> = { height: 1.88 } // 报错 “height”不在类型“Partial<Person>”中

Partial的实现原理

Partial的内部定义

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

逐步解析

// 1. keyof T 是什么意思呢？
interface Person {
  name: string
  age: number
}

type PersonKeys = keyof Person // 等同于 type PersonKeys = 'name' | 'age'

const p1: PersonKeys = 'name' // 可以
const p2: PersonKeys = 'age' // 可以
const p3: PersonKeys = 'height' // 不能将类型“"height"”分配给“name | age”

1. keyof 就是将一个类型的属性名全部提取出来当做联合类型

2. p in xx 又是什么意思呢？
   in的意思就是遍历，如上就是将 age和name进行遍历

3. [P in keyof T]? 的冒号就代表 可选 的参数

4. T[P] 就代表 如 Person[name]代表的是 string 类型

Pick （意思是选择）ts中可以选择一个原来的接口中一部分的属性定义

如果想要选择多个属性定义呢？

pick的实现原理

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

pick接收两个泛型

• 第一个泛型 T 便是 interface 或者 type 定义
• 第二个就是第一个定义中的属性， extends就代表继承
  K extends keyof T 等同于 k extends ‘name’ | ‘age’,意思就是k只能是age或者name

Exclude (意思是排除) ts中可以排除 联合类型 中一部分的内容

注意Exclude是操作联合类型的，下方将讲到的Omit是操作键值对的

Exclude的原理

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

传入两个泛型

• 我们这里用 MyTypes 也就是 ‘name’ | ‘age’ | ‘height’ 去代表 T
• 用 name 属性去代表第二个泛型 U
• T extends U 就判断是否’name’ | ‘age’ | ‘height’ 有 name， 有name就返回never,就代表将其排除

Omit (意思是省略的)ts中就是将接口或者类型的键值对删除一部分

Omit原理

也就是上面所讲解的知识点拼凑起来的

type Omit<T, K extends string | number | symbol> = {
  [P in Exclude<keyof T, K>]: T[P]
}