前言

泛型，是 TS 最难理解的部分，拿下了泛型，TS 就没什么难的了。

这是本文的知识图谱：

[](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/1ee9a28c9e804336a3773de1b9ce6261~tplv-k3u1fbpfcp-watermark.awebp?)

你掌握了吗？没掌握就一起来查漏补缺吧。

学习本文之前，先要有 TS 基础，如果觉得阅读吃力，可以先学习这篇文章，通俗易懂的 TS 基础知识总结

为什么需要泛型？

如果你看过 TS 文档，一定看过这样两段话：

软件工程中，我们不仅要创建一致的定义良好的 API，同时也要考虑可重用性。 组件不仅能够支持当前的数据类型，同时也能支持未来的数据类型，这在创建大型系统时为你提供了十分灵活的功能。

在像 C# 和 Java 这样的语言中，可以使用泛型来创建可重用的组件，一个组件可以支持多种类型的数据。 这样用户就可以以自己的数据类型来使用组件。

简直说的就不是人话，你确定初学者看得懂？

我觉得初学者应该要先明白为什么需要泛型这个东西，它解决了什么问题？而不是看这种拗口的定义。

我们还是先来看这样一个例子，体会一下泛型解决的问题吧。

定义一个 print 函数，这个函数的功能是把传入的参数打印出来，再返回这个参数，传入参数的类型是 string，函数返回类型为 string。

function print(arg:string):string {
    console.log(arg)
    return arg
}
复制代码

现在需求变了，我还需要打印 number 类型，怎么办？

可以使用联合类型来改造：

function print(arg:string | number):string | number {
    console.log(arg)
    return arg
}
复制代码

现在需求又变了，我还需要打印 string 数组、number 数组，甚至任何类型，怎么办？

有个笨方法，支持多少类型就写多少联合类型。

或者把参数类型改成 any。