javascript多维数组按照key值合并的问题

Question

                var arr = [{
                    key: 1,
                    name: 2,
                    job: 3
                }, {
                    key: 1,
                    name: 22,
                    job: 33
                }, {
                    key: 2,
                    name: 222,
                    job: 333
                }, {
                    key: 2,
                    name: 2222,
                    job: 3333
                }];

arr 这个数组有多个字段，我想根据key这个字段相同的属性的时候，就进行合并。
最终想实现的结果如arr2

    arr2 = [{
                    key: 1,
                    info: [{
                        name: 2,
                        job: 3
                    }, {
                        name: 22,
                        job: 33
                    }]
                }, {
                    key: 2,
                    info: [{
                        name: 222,
                        job: 333
                    }, {
                        name: 2222,
                        job: 3333
                    }]
                }];

Answer 1

var keys = Array.from(new Set(arr.map(o=>o.key)));
var result = keys.map(key=>{
    return {key: key,
        info: arr.filter(o=>o.key==key).map(o=>({name:o.name, job:o.job}))
    }
});
console.log(result);

Answer 2

function mergeKey(arr) {
  const keyMap = arr.reduce((r, item)=>{
    const newItem = {...item};
    delete newItem.key;
    r[item.key] = (r[item.key] || []).concat(newItem);
    return r;
  }
  , {});

  return Object.keys(keyMap).map(key=>({
    key,
    info: keyMap[key],
  }));
}

mergeKey(arr)

Answer 3

let resultArr=[];//结果数组
arr.forEach(item=>{
    
    //判断数组里是否有这一项,空数组filter出来也是空的，所以无需特殊判断
    let fltrArr=resultArr.filter(_item=>_item.key==item.key);
    //无=>向结果数组里加一项，有=>将filter出的结果的(应该只有一条)的info里push一下 
    //name,job,filter的结果是浅拷贝的，所以对应的resultArr里也会改变
    fltrArr.length==0?
    resultArr.push({key:item.key,info:[{name:item.name,job:item.job}]})
    :fltrArr[0].info.push({name:item.name,job:item.job})
    
})