请求根据ID对JavaScript对象数组进行分组，将同ID对象归集到info数组的实现方案

这是一个很常见的数组分组需求，我们可以利用JavaScript原生的Array.reduce()方法高效实现，代码简洁易懂，还能保证良好的性能。

实现代码 #

首先定义你的原始数组：

const originalArray = [
  {id: "e60ff4a3", name: "Alex", work: "constructor"},
  {id: "fbd59f52", name: "Morgan", work: "engineer"},
  {id: "e60ff4a3", name: "Ana", work: "teacher"},
  {id: "715f0686", name: "Smith", work: "doctor"},
  {id: "715f0686", name: "David", work: "keeper"},
  {id: "fbd59f52", name: "Emma", work: "nurse"},
];

核心转换逻辑：

// 使用reduce构建分组映射，再转为目标数组格式
const groupedArray = Object.values(
  originalArray.reduce((acc, currentItem) => {
    // 如果当前ID还未在累加器中，初始化分组对象
    if (!acc[currentItem.id]) {
      acc[currentItem.id] = {
        id: currentItem.id,
        info: []
      };
    }
    // 将当前项的name和work存入对应分组的info数组
    acc[currentItem.id].info.push({
      name: currentItem.name,
      work: currentItem.work
    });
    return acc;
  }, {}) // 初始值为空对象
);

简化版代码（用解构赋值） #

如果想让代码更简洁，可以用对象解构来减少重复代码：

const groupedArray = Object.values(
  originalArray.reduce((acc, { id, name, work }) => {
    acc[id] = acc[id] || { id, info: [] };
    acc[id].info.push({ name, work });
    return acc;
  }, {})
);

代码逻辑说明 #

1. reduce() 遍历原始数组，构建一个临时的ID-分组对象映射表，键是ID，值是包含该ID和对应info数组的对象。
2. 每遍历一个元素，先检查映射表中是否已有该ID的分组：没有就初始化，有就直接复用。
3. 把当前元素的name和work提取出来，添加到对应分组的info数组里。
4. 最后用Object.values()把映射表的所有分组对象提取出来，转换成你需要的数组格式。

亲测有效，你可以直接把这段代码复制到项目里使用，如果有其他特殊需求（比如需要保留更多字段），只需要调整push进去的对象内容就行~

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