JavaScript合并数组重复name对象的id字段问题求助

嘿，我来帮你搞定这个问题！你想要把原数组中相同name的对象合并，把对应的id整理成数组（如果只有一个id就保留单个值）对吧？单独用find()确实搞不定，因为它只能找到第一个匹配的元素，没办法完成批量的合并工作。下面给你两种可行的解决思路，推荐第一种更高效的方案：

方案一：使用reduce()构建映射（推荐） #

这种方法只需要遍历原数组一次，效率更高，代码也更简洁：

1. 第一步：用reduce()创建name到id数组的映射
   我们先创建一个中间对象，把每个name作为key，对应的所有id收集到数组里作为value。
2. 第二步：将映射转换为目标数组
   遍历这个映射，把每个key-value对转换成对象，同时处理id的格式——如果数组长度是1，就把它变成单个值，否则保留数组。

代码示例：

const array = [{ name: "Name 1", id: 1 }, { name: "Name 2", id: 2 }, { name: "Name 3", id: 3 }, { name: "Name 1", id: 4 }, { name: "Name 1", id: 5 }, { name: "Name 2", id: 6 }];

// 构建name到id数组的映射
const nameToIdsMap = array.reduce((acc, current) => {
  // 如果当前name不在映射中，初始化空数组
  if (!acc[current.name]) {
    acc[current.name] = [];
  }
  // 将当前id加入对应数组
  acc[current.name].push(current.id);
  return acc;
}, {});

// 转换为目标数组，处理id格式
const newArray = Object.entries(nameToIdsMap).map(([name, ids]) => ({
  name,
  id: ids.length === 1 ? ids[0] : ids
}));

console.log(newArray);
// 输出结果正是你想要的：
// [
//   { name: "Name 1", id: [1, 4, 5] },
//   { name: "Name 2", id: [2, 6] },
//   { name: "Name 3", id: 3 }
// ]

方案二：用find()配合循环实现（不推荐，仅作参考） #

如果你坚持想用find()，可以通过循环遍历原数组，每次用find()查找新数组中是否已有相同name的项，再做合并。不过这种方法的时间复杂度是O(n²)，数组大的时候性能会差很多：

const array = [{ name: "Name 1", id: 1 }, { name: "Name 2", id: 2 }, { name: "Name 3", id: 3 }, { name: "Name 1", id: 4 }, { name: "Name 1", id: 5 }, { name: "Name 2", id: 6 }];

const newArray = [];

for (const item of array) {
  // 查找新数组中是否已有相同name的元素
  const existingItem = newArray.find(obj => obj.name === item.name);
  
  if (existingItem) {
    // 如果已存在，处理id的合并
    if (Array.isArray(existingItem.id)) {
      existingItem.id.push(item.id);
    } else {
      // 把单个id转为数组，再添加新id
      existingItem.id = [existingItem.id, item.id];
    }
  } else {
    // 如果不存在，直接添加新项
    newArray.push({ ...item });
  }
}

console.log(newArray);

为什么单独用find()不行？ #

find()的作用是返回数组中第一个满足条件的元素，它没法帮你批量收集所有相同name的id，也没法自动合并已有的项。所以必须配合循环或者reduce()这类累加方法才能完成需求。

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