Typescript中extends的作用

可以总结为以下几种：

1、接口继承

可以继承父类接口的方法和属性

interface Animal {
  name: string
}

interface Dog extends Animal {
  sayHello: () => void
}
// dog具有Animal的name属性。
const dog: Dog = {
  name: 'tom',
  sayHello: function() {
    
  }
}

 

2、普通条件判断

用来判断一个类型是否可以分配给另外一个类型

A extends B，是表示A类型能够分配给B类型，而不是表示A类型是B类型的子集。换句话来说，如果条件判断的时候A extends B为true，则说明约束A类型的一切约束条件，B类型都具有。

interface Animal {
  name: string
}

interface Dog extends Animal {
  sayHello: () => void
}

const dog: Dog = {
  name: 'tom',
  sayHello: function() {

  }
}

type bool = Animal extends Dog ? 'yes': 'no' // bool = 'no'
type bool1 = Dog extends Animal ? 'yes': 'no' // bool1 = 'yes'

 

3、泛型条件判断

对于使用extends关键字的条件类型，如果extends前面的参数是一个泛型类型，当传入该参数的是联合类型，则使用分配律计算最终的结果。

分配律是指，将联合类型的联合项拆成单项，分别代入条件类型，然后将每个单项代入得到的结果再联合起来，得到最终的判断结果。

满足两个要点即可适用分配律：

1. 参数是泛型类型，
2. 代入参数的是联合类型

在条件判断类型的定义中，将泛型参数使用[]括起来，即可阻断条件判断类型的分配，此时，传入参数T的类型将被当做一个整体，不再分配。

type Animal<T> = T;
type Animal1<T> = [T];
type Dog = Animal<'x' | 'y'>; // Dog = 'x' | 'y'
type Dog1 = Animal1<'x' | 'y'>; // Dog1 = ['x' | 'y']

type A = 'x' extends Dog ? 'yes': 'no'; // A= 'yes'
type B = 'x' extends Dog1 ? 'yes': 'no'; // B = 'no'
type C = ['x' | 'y'] extends Dog1 ? 'yes':'no' // C = 'yes'
type D = 'x' | 'y' extends Dog ? 'yes' : 'no' // D = 'yse'

4、泛型约束

在书写泛型时，往往需要对类型参数作一定对限制。

function getInfo<T, key extends keyof T>(obj: T, key: key): T[key]{
return obj[key]
}

const obj = {
name: 'tom',
age: 12
}

getInfo(obj, 'age') // 这里第二个参数只能传age或者name，传其他的字段都会报错。