TS泛型

官网地址，本文也是参考官网来写：https://ts.xcatliu.com/advanced/generics.html

 

 

罗嗦一下使用场景：

比如说现在有个函数接收的参数是number，
但过一段时间后需要同时支持number、string，当然可以这么写：number | string
但万一再过段时间需要支持number、string、boolean怎么办总不能直接写any吧，
容易挨骂anyscript，这时候泛型就派上用场了

借用官网的话：在定义函数、接口或类的时候，不预先指定具体的参数类型，而在被调用时候再指定类型的一种特性。

 

说人话就是我干脆不定义参数类型了，人家给我什么类型我就用什么类型
基于可以使用泛型来创建可重用可拓展的组件
支持当前数据类型，同时也能支持未来的数据类型。
扩展灵活。可以在编译时发现你的类型错误，从而保证了类型安全。

 

上面巴拉巴拉说一大堆，复制以下代码跑几遍，仔细观察下输出内容就知道怎么回事了

function createArray<T>(length: number, value: T): Array<T> {
  let result: T[] = [];
  for (let i = 0; i < length; i++) {
    result[i] = value;
  }
  return result;
}
// 调用函数时指定输出数据为stringz
console.log(createArray<string>(3, 'x')); // ['x', 'x', 'x']
// 如果不指定，就自动根据传入参数类型决定输出数组内容类型
console.log(createArray(3, true)); // [true, true, true]

 

function getUser2<A, B, C>(user: [A, B, C]): [A, B, C] {
  return [user[0], user[1], user[2]]
}
console.log(getUser2(["Tom", 18, true])); // ["Tom", 18, true]
console.log(getUser2([18, "Tom", true])); // [18, "Tom", true]

 

 

关于函数输出为对象适不适合用泛型的讨论：

interface UserProp { name: String, age: Number, sex: Boolean }
function getUser4<A extends String, B extends Number, C extends Boolean>(user: [A, B, C]): UserProp {
  return {
    name: user[0], 
    age: user[1], 
    sex: user[2]
  }
}
console.log(getUser4(["Tom", 18, true]));

看代码得知输入参数类型已经定义，所以调用getUser4函数的参数是固定的这不符合泛型的思想，

所以如果函数输出为对象则没必要上泛型

 

随便说点啥：

很多时候很多技术的官网就说的足够明白了，可编程这种东西是抽象化的，

单纯通过文字表达是很苍白无力的，所以就有了各种视频教学、各种博客各种角度去理解去分析，

其实只要get到技术的思维逻辑，回头看看官网文档就很好理解掌握新知识，

 

人与人之间是客观存在差距的，大佬思维好一看官网就懂，

小白没那么容易理解得通过各种辅助方法去理解新知识新技术，

我就属于后者，一开始看官网感觉各种迷茫，多百度多请教其他大佬，也逐渐掌握了泛型的作用