如何在TypeScript中使用泛型实现通用find函数？

问题背景 #

我想实现一个自定义find函数，接收两个参数：数字或对象数组，以及一个返回布尔值的回调函数，最终返回匹配的元素或undefined。但当前代码只支持数字类型，没法适配对象数组的测试用例，尝试用泛型但不知道怎么覆盖所有类型。

当前代码 #

type CallBack = (input: number) => boolean;

export function find(array: number[], callback: CallBack) {
  array.forEach((elem) => {
    if (callback(elem)) {
      return elem;
    }
  });
}

测试用例 #

const returnValue1 = find([1, 2, 3], (el) => el === 2);
expect(returnValue1).toEqual(2);

const returnValue2 = find(
  [
    { v: false, id: 1 },
    { v: true, id: 2 },
    { v: true, id: 3 },
  ],
  (el) => el.v
);
expect(returnValue2).toEqual({ v: true, id: 2 });

const returnValue3 = find(
  [
    { v: false, id: 1 },
    { v: false, id: 2 },
    { v: false, id: 3 },
  ],
  (obj) => obj.v
);
expect(returnValue3).toEqual(undefined);

问题分析 #

1. 类型硬编码：当前代码把数组和回调的参数都固定为number类型，自然无法支持对象或其他类型。
2. forEach的误区：forEach的回调函数里的return只会终止当前回调迭代，不会让外层的find函数返回值，所以当前函数永远返回undefined。

修正方案：使用泛型实现通用类型支持 #

通过泛型<T>让函数适配任意类型的数组，同时改用普通循环来实现正确的返回逻辑：

export function find<T>(array: T[], callback: (elem: T) => boolean): T | undefined {
  for (const elem of array) {
    if (callback(elem)) {
      return elem;
    }
  }
  return undefined;
}

代码说明 #

• 泛型<T>：作为类型占位符，TypeScript会根据传入的数组自动推断T的具体类型（比如数字数组时T=number，对象数组时T为对应对象类型），完美覆盖所有可能的类型。
• 返回类型T | undefined：明确表示函数要么返回匹配的T类型元素，要么返回undefined，符合需求。
• for...of循环：遍历数组时，一旦找到符合回调条件的元素就立即返回，遍历结束后没找到则返回undefined，逻辑和原生Array.prototype.find一致。

验证测试用例 #

现在三个测试用例都能正常通过：

1. 数字数组能正确返回匹配的数字2；
2. 对象数组能返回第一个v=true的对象{ v: true, id: 2 }；
3. 无匹配元素时返回undefined。

内容的提问来源于stack exchange，提问作者Deanooooo