TS 之接口和泛型

最近项目需要使用ts，那么接口和泛型是一定需要了解的，今天他们两个的特性总结一波

接口

接口是定义对象一个对象的结构，定义一个对象中应该包含哪些属性和方法。

1.怎么定义？

使用关键字interface定义，看代码

interface cat {

  name:string

  age:number

}

const per:cat = {

  name: 'xiaoming',

  age: 18,

  // sex: '男', //报错，sex没有在cat中定义,接口未写的属性不可以定义

}

接口也可以同类型声明使用，这点和type是一样的，看代码

type typeCat= {

  name:string,

  age: number

}

const per:typeCat = { 自定义的属性和方法...}

不过type声明不可以重复，这点和let const是相同的 ，接口interface可以声明两次，结果是两个接口的属性方法的合并

interface cat {

  name:string

  age:number

}

interface cat {

  sex:string

}
//等价于
interface cat {

  name:string

  age:number

  sex:string

}
//如果第二个声明或者第n个声明中，有之前声明过的属性，则属性类型必须一致

泛型

定义：在定义函数或类时，遇到类型不明确的，可以使用泛型，泛型就是一个不确定的类型，调用时传入具体类型，看代码

function fn<T>(uncertain: T): T{ 

    return uncertain

}

比如说fn(10),那么传入的参数类型就是number，即T的类型被推断为number类型，还有一种写法

fn<string>("cat"),指定传入的参数是string类型

上面只是指定了一个泛型，你也可以指定多个泛型，看代码

function fn<T, U>(a:T, b:U):T{

  return a

}

调用方法是一样的，比如说fn(10,"cat"）或者指定类型fn<number,string>(10,"cat")

泛型范围的限制

T extends interface表示泛型T 必须是interface的子类，看代码

---

interface strlength{

  length: number

}

function fn<T extends strlength>(a:T):number{

  return a.length

}

fn('cat')

 解释一下(从左到右)，定义函数，指定其传入的参数必须含有其定义的属性，后边的number是函数输出的类型，当我们传入'cat'，函数fn就会输出cat的字符串的长度。