定义：泛型在保证安全的前提下可以让多种类型一起工作

基本使用示例：

JavaScript中实现一个函数传入数据返回数据本身

  1. function id(value: any):any{return value}

该方法会导致失去TS的类型保护，从而使得数据类型不安全
解决方法：使用TS泛型

  1. //定义该函数
  2. function id<type>(value: Type): Type{return value}
  3. //调用该函数
  4. let num = id<number>(10)//此时num类型为number
  5. //由于TS的类型推论机制，可以简写为如下代码
  6. let num = id(10)        //此时num类型为10，即为字面量类型

泛型约束

默认情况下，泛型的类型type代表了多个类型，这就导致了无法访问任何元素的属性

  1. function id<Type>(value: Type): Type {
  2.  //console.log(value.length)//err:value不含有length属性
  3.   return value
  4. }

更改方法：使用泛型收缩类型

主要有两种方法

1.指定更加具体的类型

  1. //把type改写为数组类型
  2. function id<Type>(value: Type[]): Type[] {
  3.  console.log(value.length)
  4.   return value
  5. }

2.添加约束

  1. //添加有length属性的接口
  2. interface ILength{length:number}
  3. //让函数的属性Type继承ILength，则Type具有了length的属性
  4. function id<Type extends ILength>(value: Type): Type {
  5.  console.log(value.length)
  6.   return value
  7. }
  8. //具有length的变量类型都可以调用该函数
  9. id(['a','b','c']} //数组有length属性
  10. id(abc)           //字符串有length属性
  11. id({lenth:10,name:jack}) //对象有length属性
  12. //id(123)//错误演示，number不具有length属性

类型变量之间可以互相约束

列子：创建一个函数来获取对象中的属性的值

  1. function getProp<Type,key extends keyof Type>(obj:Type,key:key){
  2.   return obj[key]
  3. }
  4. let person = {name:'jack',age:18}
  5. getProp(person,'name')
  6. //只有有包含关系都可以访问，如：
  7. getProp(18,'toFixed')
  8. getProp('abc','split')
  9. getProp('abc',1)//此时1表示索引，即为abc中的b
  10. getProp(['a'],'length')