如何合并数组中name字段重复的对象的item数组

可以用Array.prototype.reduce()实现这个需求，它能帮你遍历数组并累积出最终的合并结果：

const myArray = [
  { name: "1", item: [{ id: 1 }] },
  { name: "2", item: [{ id: 2 }] },
  { name: "1", item: [{ id: 3 }] }
];

const mergedArray = Object.values(myArray.reduce((acc, current) => {
  // 检查当前name是否已在累积容器中存在
  if (acc[current.name]) {
    // 存在则合并item数组元素
    acc[current.name].item.push(...current.item);
  } else {
    // 不存在则存入新对象（浅拷贝避免修改原数组）
    acc[current.name] = { ...current };
  }
  return acc;
}, {}));

console.log(mergedArray);
// 输出结果：
// [
//   { name: "1", item: [{ id: 1 }, { id: 3 }] },
//   { name: "2", item: [{ id: 2 }] }
// ]

代码说明： #

• 用reduce遍历原数组，以空对象acc作为累积容器，name字段作为键实现快速重复项查找。
• 遍历每个对象时：
  • 若acc中已有对应name的键，就用扩展运算符...把当前对象的item元素批量推入已有对象的item数组。
  • 若没有对应name的键，就通过浅拷贝{ ...current }将当前对象存入容器，避免后续操作修改原数组数据。
• 最后用Object.values()提取累积容器中的所有值，得到去重合并后的数组。

注意点： #

• 如果item数组中是复杂嵌套对象，浅拷贝足够满足基础合并需求；若需要完全隔离原对象，可使用JSON.parse(JSON.stringify())或专门的深拷贝函数。
• 若原数组存在name为undefined/null的对象，需额外处理，避免作为对象键引发异常。

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