如何使用JavaScript合并相同vendorID的对象并将对应productID归入products数组

嘿，这个按供应商ID分组产品的需求太常见啦，我给你分享两种靠谱的JavaScript实现方法，直接就能用👇

方法一：使用Array.prototype.reduce()（简洁易读） #

这是最常用的实现方式，代码简洁易懂，适合大多数中小数据量的场景：

let obj = [ 
  {vendorID: 101, productID: "A"}, 
  {vendorID: 102, productID: "B"}, 
  {vendorID: 101, productID: "C"}, 
  {vendorID: 102, productID: "D"} 
];

const result = obj.reduce((acc, current) => {
  // 查找当前供应商是否已经在累加器里有分组
  const vendorGroup = acc.find(item => item.vendorID === current.vendorID);
  
  if (vendorGroup) {
    // 已有分组，直接追加当前产品
    vendorGroup.products.push({ productID: current.productID });
  } else {
    // 没有分组，新建一个包含该产品的供应商对象
    acc.push({
      vendorID: current.vendorID,
      products: [{ productID: current.productID }]
    });
  }
  
  return acc;
}, []);

console.log(result);
// 输出结果就是你想要的expected_output格式

方法二：使用Map优化性能（适合大数据量） #

如果你的数组数据量比较大，上面的find方法会因为遍历数组导致性能下降，这时候用Map来存储分组会更高效，因为Map的查找是O(1)时间复杂度：

let obj = [ 
  {vendorID: 101, productID: "A"}, 
  {vendorID: 102, productID: "B"}, 
  {vendorID: 101, productID: "C"}, 
  {vendorID: 102, productID: "D"} 
];

const vendorMap = new Map();

obj.forEach(item => {
  // 如果Map里没有当前供应商，就初始化一个分组对象
  if (!vendorMap.has(item.vendorID)) {
    vendorMap.set(item.vendorID, { vendorID: item.vendorID, products: [] });
  }
  // 将当前产品添加到对应供应商的products数组中
  vendorMap.get(item.vendorID).products.push({ productID: item.productID });
});

// 把Map中的值转换成数组，就是最终结果
const result = Array.from(vendorMap.values());

console.log(result);

两种方法都能完美得到你想要的输出格式，根据你的数据量大小选就行~

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