javascript - 操作对象数组中的对象

Question

我有这个 javascript 对象:

var arr1 = [{id:'124',name:'qqq'}, 
           {id:'589',name:'www'}, 
           {id:'45',name:'eee'},
           {id:'567',name:'rrr'}]

var arr2 = [{id:'124',name:'ttt'}, 
           {id:'45',name:'yyy'}

我需要用 arr2 中具有相同 id 的项目替换 arr1 中的对象。

这是我如何达到预期结果的:

arr1.map(obj => arr2.find(o => o.id === obj.id) || obj);

结果如下:

var arr1 = [{id:'124',name:'ttt'}, 
           {id:'589',name:'em'}, 
           {id:'45',name:'yyy'},
           {id:'567',name:'eme'}];

但是这个解决方案的问题是:

arr1.map(obj => arr2.find(o => o.id === obj.id) || obj);

不适用于 IE 浏览器。

如何更改上面的行以在 IE 和 Chrome 浏览器中获得所需的结果？

var arr1 = [{
    id: '124',
    name: 'qqq'
}, {
    id: '589',
    name: 'www'
}, {
    id: '45',
    name: 'eee'
}, {
    id: '567',
    name: 'rrr'
}];

var arr2 = [{
    id: '124',
    name: 'ttt'
}, {
    id: '45',
    name: 'yyy'
}];

var res = arr1.map(obj => arr2.find(o => o.id === obj.id) || obj);

console.log(res);

Answer 1

如果您想使用Array.prototype.find()，您需要为不支持它的浏览器使用推荐的polyfill。

参见MDN Array.protoype.find() polyfill