在对象数组中按公共属性对项目进行分组

问题描述

我有两个大数组，一个是项目，另一个是拥有这些项目的名字。我需要将所有具有匹配项的名称推送到 array2 项中。

我可以通过嵌套 forEach 循环来做到这一点：

array1 = [
  {item: "1",name: "Joe" },{item: "2",name: "Sam" },{item: "1",name: "Alice"},{item: "3",name: "Peter"},name: "Jack"},]

array2 = [
  { item: "1",names: []},{ item: "2",{ item: "3",]

array2.forEach(x => {
    array1.forEach(y => {
        if( x.item === y.item ){
        x.names.push(y.name)
        }
    })
})
console.log(array2)

但我觉得这是不好的做法，更不用说大型阵列上的资源繁重了。

这样做的现代方法是什么？

解决方法

我相信，您最好利用 Map：

您可以使用 Array.prototype.reduce() 将您的源数组转换为 Map，其中 item 将是一个键；
使用 Map.prototype.values() 遍历生成的地图以获得分组条目

const src = [
        {item: "1",name: "Joe" },{item: "2",name: "Sam" },{item: "1",name: "Alice"},{item: "3",name: "Peter"},name: "Jack"},],result = [...src
        .reduce((acc,{item,name}) => {
          const group = acc.get(item)
          group
            ? group.names.push(name)
            : acc.set(item,names:[name]})
          return acc
        },new Map)
        .values()
      ]
      
console.log(result)

array2.forEach(a2 => { 
     let names = array1.filter(a1 => a1.item === a2.item)
                       ?.map(n => n.name); 
     a2.names = names ?? []; 
});

foreach html javascript