如何修改TypeScript的groupBy函数，让返回对象拥有明确键类型？

要让IDE能对groupBy的返回对象提供有效键的智能提示，核心是让TypeScript捕获到具体的键字面量类型，而不是宽泛的string类型。你可以通过扩展泛型参数、约束键的类型来实现，具体修改如下：

修改后的函数代码 #

export function groupBy<T, K extends string>(
  array: T[],
  getKey: (item: T) => K
) {
  const map = new Map<K, T[]>();
  array.forEach((item) => {
    const key = getKey(item);
    const group = map.get(key);
    group ? group.push(item) : map.set(key, [item]);
  });

  return Object.fromEntries(map.entries()) as Record<K, T[]>;
}

关键改动说明 #

• 新增泛型参数K extends string：用来捕获getKey返回的具体键字面量类型（比如'a' | 'b'，而不是string）
• 约束getKey的返回类型为K：让TypeScript能从传入的回调中推断出实际的键集合
• 调整Map的类型为Map<K, T[]>：保证整个分组过程的类型一致性
• 断言返回值为Record<K, T[]>：帮助TypeScript正确推断返回对象的结构，避免因Object.fromEntries的类型宽泛导致的信息丢失

使用示例（带智能提示） #

当你传入的数组包含确定的键值，且getKey返回明确的字面量时，IDE会自动提示有效键：

// 用const断言让TypeScript捕获具体的键值
const items = [
  { category: 'fruit', name: 'apple' },
  { category: 'vegetable', name: 'carrot' },
  { category: 'fruit', name: 'banana' },
] as const;

const groupedItems = groupBy(items, item => item.category);
// 此时groupedItems的类型是Record<'fruit' | 'vegetable', readonly [...][]>
// IDE会提示你可以访问'fruit'和'vegetable'两个键

如果你的数组在运行时可能包含未知键，这种方式会保留类型安全——TypeScript会限制你只能访问推断出的键，避免误写不存在的键名。

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