typescript 高级类型

常用的 ts 中定义类型我们一般会使用到 type 或者是 interface

type 中可以定义联合类型,如

type A = {
    name:string;
    age:number
}

type B = {
    id:number;
    sex:string;
}

// 这就是联合类型
type C = A & B

// 这里在定义 user 的类型是 C 时就必须要实现 name、age、id、sex 属性
const user:C = {
}

typescript 高级类型_第1张图片

typescript 高级类型_第2张图片 

 这就是联合类型了

// 可以通过 Partial 来将类型 A 中的属性变为可选的
const D = Partial

typescript 高级类型_第3张图片

 typescript 高级类型_第4张图片

 这样就可以只使用类型中的部分属性

typescript 高级类型_第5张图片

 

   // 使用 Pick 将类型 A 中的属性 ‘age’ 包含在其中
  type E = Pick
  // 这就是联合类型 B & E
  type C = B & E
  
  // 这里就务必需要实现 E 中包含 A 类型中的属性 ‘age’ 了
  const user: C = {
    id: 1,
    sex: 'man',
    age:12
  }

与之 Pick 相反的是 Omit 剔除

typescript 高级类型_第6张图片

type A = 'a' | 'b'
type B = 'b' | 'c'
// 通过 Exclude 来从 类型 A 中查找在类型 B 中不存在的值
type G = Exclude
// 这里 T 就只能等于 'a'
const T:G = 'a'


type U = {
  id:number,
  name: string,
  age?: number,
  sex?:number
}
// 此时 C 就是只有一个包含 name 属性的可选类型
type C = Partial>

// 因此,还可以定义更为复杂些的类型
type S = 'name'|'age'
// Omit 剔除 V 在 T 中的属性,此时 F 仅包含 U 类型中的 name 跟 sex Pick 取 U 中的 S 属性 Partial 并将其变为可选属性 由于 Omit 被联合 所以此时的 F 中 name 为必须,sex 为可选
type F = Partial> & Omit
const u: F= {
  name: '葛长老',
}

// 这样就将类型定义为 全部可选
type G =  Partial|Omit>

const Gu:G

 typescript 高级类型_第7张图片

that all

 

你可能感兴趣的:(笔记,typescript,javascript,前端)