如何按Key合并对象数组？实现相同NOMOR_CB的ITEM值合并

嘿，我来帮你搞定这个合并需求！你想要通过循环实现把相同NOMOR_CB的对象合并，对应的ITEM值拼成逗号分隔的字符串对吧？咱们用一个简单的分组思路就能实现，核心是先通过临时对象跟踪每个CB编号对应的条目，再把它转成目标数组。

实现思路 #

1. 创建一个临时映射对象，用NOMOR_CB作为键，这样能保证每个CB编号唯一对应一个条目。
2. 遍历原始数组：
   • 遇到新的NOMOR_CB时，在映射里初始化一个包含该CB编号和当前ITEM的对象。
   • 遇到已存在的NOMOR_CB时，把当前ITEM拼接到对应条目的ITEM字符串后面。
3. 最后把映射对象里的所有值提取出来，就是你要的合并后数组。

原生JavaScript循环实现 #

const originalArr = [{ "NOMOR_CB": "CB/20-0718", "ITEM": "ABC" }, { "NOMOR_CB": "CB/20-0719", "ITEM": "A1" }, { "NOMOR_CB": "CB/20-0719", "ITEM": "A2" }];
const tempMap = {};

// 遍历原始数组，分组收集ITEM
for (let i = 0; i < originalArr.length; i++) {
  const currentItem = originalArr[i];
  const cbNumber = currentItem.NOMOR_CB;

  if (!tempMap[cbNumber]) {
    // 首次遇到该CB编号，初始化条目
    tempMap[cbNumber] = {
      NOMOR_CB: cbNumber,
      ITEM: currentItem.ITEM
    };
  } else {
    // 已存在该CB编号，追加ITEM字符串
    tempMap[cbNumber].ITEM += `, ${currentItem.ITEM}`;
  }
}

// 把映射转成最终数组
const mergedArr = Object.values(tempMap);
console.log(mergedArr);

jQuery $.each循环实现 #

如果你习惯用jQuery的遍历方法，也可以这样写：

const originalArr = [{ "NOMOR_CB": "CB/20-0718", "ITEM": "ABC" }, { "NOMOR_CB": "CB/20-0719", "ITEM": "A1" }, { "NOMOR_CB": "CB/20-0719", "ITEM": "A2" }];
const tempMap = {};

$.each(originalArr, function(index, currentItem) {
  const cbNumber = currentItem.NOMOR_CB;

  if (!tempMap[cbNumber]) {
    tempMap[cbNumber] = {
      NOMOR_CB: cbNumber,
      ITEM: currentItem.ITEM
    };
  } else {
    tempMap[cbNumber].ITEM += `, ${currentItem.ITEM}`;
  }
});

const mergedArr = Object.values(tempMap);
console.log(mergedArr);

为什么你的原有代码没生效？ #

你之前的循环应该是直接在拼接数组字符串，没有做分组跟踪的逻辑——没有记录哪些CB编号已经出现过，所以没法把相同CB的ITEM合并到同一个条目里。上面的方法用临时映射解决了这个问题，确保每个CB编号只对应一个条目，自然就能实现合并效果啦。

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