TypeScript中如何为reduce转id键对象数组定义类型？

我们日常获取数据时，经常会拿到包含带唯一id的复杂对象数组，示例如下：

const arrayOfObjects = [
  {
    id: '56gfl3Y23',
    brand: 'Bosch',
    price: 1234,
    specs: ['feature1', 'feature2', 'feature3'],
    // ... 其他字段
  },
  // ... 其他对象
];

在JavaScript里，我们可以用reduce方法把这个数组转换成以id为键的对象结构，但你原来的写法里初始值用了数组[]，这是导致TypeScript报错的核心原因——数组只能用数字作为索引，而你想用字符串id当索引，自然会抛出Element implicitly has an 'any' type because index expression is not of type 'number'的错误。

首先先定义好IProduct接口：

interface IProduct {
  id: string;
  brand: string;
  price: number;
  specs: string[];
  // ... 其他字段
}

正确的类型定义写法 #

方法一：直接指定累加器的类型

把reduce的初始值改成空对象{}，同时明确累加器的类型为Record<string, IProduct>（Record是TypeScript内置工具类型，用来定义键为string、值为IProduct的对象）：

const productsById = arrayOfObjects.reduce((acc: Record<string, IProduct>, product: IProduct) => {
  acc[product.id] = product;
  return acc;
}, {} as Record<string, IProduct>);

方法二：用泛型封装通用函数

如果需要多次处理这类转换，可以封装一个通用的泛型函数，让它支持任意带id的对象类型：

function arrayToKeyedObject<T extends { id: string }>(arr: T[]): Record<string, T> {
  return arr.reduce((acc, item) => {
    acc[item.id] = item;
    return acc;
  }, {} as Record<string, T>);
}

// 使用时直接传入数组
const productsById = arrayToKeyedObject<IProduct>(arrayOfObjects);

关键说明 #

• 错误根源是你把reduce的初始值写成了数组[]，但我们需要的是对象结构，所以必须把初始值换成{}并指定正确的类型。
• Record<K, V>是TypeScript的内置工具类型，专门用来表示“键类型为K、值类型为V”的对象，比手动写{ [key: string]: IProduct }更简洁。
• 泛型写法可以复用逻辑，只要对象有id字段就能使用，扩展性更强。

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