TypeScript 如何写通用函数
我们平时写JavaScript的时候，经常会遇到“处理不同类型数据”的需求，比如写一个函数，既要能处理数字数组，又要能处理字符串数组，总不能写两个几乎一样的函数吧？这时候就轮到TypeScript的通用函数出马了，它能让一个函数适配多种类型，还不用牺牲类型安全。
先搞懂：通用函数到底解决了什么麻烦？
举个生活化的例子：你开了个小超市，想做个“把商品放进购物袋”的操作。如果是普通JS，你可能写个函数，参数是any类型，这样既能放零食，又能放文具，但坏处是——万一你不小心把钱塞进购物袋时填错了参数名，TS根本不会提醒你，最后结账时钱少了都找不到原因。
而通用函数就像“多功能购物袋”，上面有个“可适配的标签”，你装零食时，标签自动对应食品区；装文具时，标签对应文具区，既不用做两个袋子，又能保证装的东西不会乱。
TypeScript写通用函数的基础：加个“类型变量”
通用函数的核心是用类型变量来代表“不确定的类型”，就像数学里用x、y代表未知数，这里用T、U这类字母代表“暂时不确定的类型”，调用函数时再确定具体是啥类型。
举个简单的例子：我们要写一个函数，返回数组的第一个元素。如果用普通写法，只能处理数字数组或字符串数组，换类型就得重写；用通用函数就很灵活：
`typescript
// T就是代表元素类型的变量，调用时才确定具体是string还是number
function getFirstElement<T>(arr: T[]): T {
return arr[0]
}
`
这里的<T>就是关键——它告诉TS：“这个函数里的类型是不确定的，具体类型由调用者决定”。比如你传[1,2,3]，T自动变成number，返回值就是数字类型；你传["苹果","香蕉"]，T自动变成string，返回值就是字符串类型，完全不用额外写类型判断。
进阶用法：多个通用类型，适配更复杂的场景
如果函数需要处理两种不同类型的参数，就可以用多个通用类型变量，就像你买了“零食+饮料”的组合装，两个部件类型不同，但能搭配使用。
比如写一个“配对函数”，把两个不同类型的数组对应位置的元素配对成新数组：
`typescript
// 用T和U分别代表两个数组的元素类型
function pairArrays<T, U>(arr1: T[], arr2: U[]): [T, U][] {
return arr1.map((item, index) => [item, arr2[index]])
}
`
调用时如果传[1,2,3]和["a","b","c"]，返回的就是[number, string][]类型的数组，TS会自动帮你检查每个配对的类型，不会出现“数字和字符串乱配对”的问题。
小技巧：用默认类型简化通用函数
有时候通用类型有常见的默认值，就像购物袋默认是塑料袋，需要时再换布袋，TS也支持给类型变量设默认类型，减少重复定义。比如写一个“过滤数组中符合条件的元素”的通用函数，默认处理字符串数组：
`typescript
// 给T设默认类型为string
function filterArray<T = string>(arr: T[], condition: (item: T) => boolean): T[] {
return arr.filter(condition)
}
// 可以直接用默认类型，过滤字符串数组
filterArray(["红","蓝","绿"], color => color !== "蓝")
// 也可以指定类型，过滤数字数组
filterArray([1,2,3,4], num => num > 2)
`
这样既不用每次都写<string>，又能在需要其他类型时灵活切换，很适合日常开发。
其实通用函数的本质，就是在灵活和类型安全之间找平衡——既不会像普通JS那样失去类型检查，又不用为每一种类型写重复代码，是TypeScript里非常实用的一个小功能。