javascript 多维数组循环后，重新生成新数组

Question

var arr= [{id:1,name:1,job:[{a:1,a:2}]},{id:2,name:2,job:[a:3,a:4]}……];

最终想实现：

arr=[{id:1,name:1,a:1},{id:1,name:1,a:2},{id:2,name:2,a:3},{id:2,name:2,a:4}……];

说白了，就是想把job这个数组里面的元素拉出来，然后重新生成一个数组。
我用过foreach 和map，但是总发现差一点。

Answer 1

大概是这样的逻辑
ES6

var arr = [{id: 1, name: 1, job: [1, 2]}, {id: 2, name: 2, job: [3, 4]}];
const result = [].concat(...arr.map(({id, name, job}) => (job.map(a => ({id, name, a})))));
console.log(result)

---

ES5

var arr = [{id: 1, name: 1, job: [1, 2]}, {id: 2, name: 2, job: [3, 4]}];
var result = [];
arr.forEach(function (item) {
  item.job.forEach(function (a) {
    result.push({
      id: item.id,
      name: item.name,
      a: a
    })
  })
});
console.log(result);

Answer 2

递归可以实现

Answer 3

1、这样？

var arr= [{id:1,name:1,job:[{a:1,b:2}]},{id:2,name:2,job:[{a:3,b:4}]}];
arr.reduce((a,b)=>{
    var job = b.job[0]
    delete b.job
    a.push({...b, ...job})
    return a;
},[])
//[{id:1, name:1,{a:1,b:2},{id:2, name:2, a:3, b:4}];

2、这样？

var arr= [{id:1,name:1,job:[{a:1,b:2}]},{id:2,name:2,job:[{a:3,b:4}]}];
arr.reduce((a,b)=>{
    
    var job = b.job[0]
    delete b.job
    Object.keys(job).forEach(key=>{
        var newObj = {...b};
        newObj[key] = job[key]
        a.push(newObj)
    })
    return a;
},[])

// [{id:1, name:1, a:1}, {{id:1, name:1, b:2},{id:2, name:2, a:3},{id:2, name:2, b:4}];