javascript - map函数不修改javascript中的当前数组并返回修改后的新数组

Question

map 是返回新数组还是修改 java 脚本中的现有数组？ 我在这些示例 map 中有一个示例不应该修改当前数组(不工作)但它应该修改数组(它工作正常)，

let x = [{ 'name': 'a', checked: false },
{ 'name': 'b', checked: true },
{ 'name': 'c', checked: false }];

根据y名称更改x

let y = [{ 'name': 'a', checked: true },
{ 'name': 'b', checked: true },]

map 功能

y.forEach(ele =>{
  boss= x.map(item =>{
    if(ele.name == item.name){
      item.checked = true;
    }
    return item;
  });
});

预期输出

x = [{"name":"a","checked":false},{"name":"b","checked":true},{"name":"c","checked":false}]

和

boss = [{"name":"a","checked":true},{"name":"b","checked":true},{"name":"c","checked":false}] 

example sackblitz

Answer 1

您可以通过获取一个空对象并使用 Map 分配实际对象和所需的更新属性来映射新对象。 .

var array = [{ name: 'a', checked: false }, { name: 'b', checked: true }, { name: 'c', checked: false }],
    update = [{ name: 'a', checked: true }, { name: 'b', checked: true }],
    updateMap = new Map(update.map(({ name, checked }) => [name, { checked }])),
    updatedArray = array.map(o => Object.assign({}, o, updateMap.get(o.name)));

console.log(updatedArray);
console.log(array);

.as-console-wrapper { max-height: 100% !important; top: 0; }