JS forEach将数组内元素替换的问题

JS forEach将数组内元素替换的问题

let arr = [
  {   name: '1',
      id: '1'
  },{ name: '2',
      id: '2'
  },{   name: '3',
      id: '3'
  }
]

arr.forEach(list=>{
  if(list.name==='2'){
    list = {a: 'hee'}
  }
})
console.log(arr)

讲道理，第一反应，应该输出：

[[object Object] {
  id: "1",
  name: "1"
}, [object Object] {
  a: "hee"
}, [object Object] {
  id: "3",
  name: "3"
}]

但，事与愿违，输出的竟然是：

[[object Object] {
  id: "1",
  name: "1"
}, [object Object] {
  id: "2",
  name: "2"
}, [object Object] {
  id: "3",
  name: "3"
}]

也就是说，找到的name === '2'这项list没有被替换掉。

为什么？

此处，实际上，list是一个新建出来的变量，指向了arr数组的一个项。当我们赋值list = {a: 'hee'}的时候，只是改变了list变量的指向；而没有改变arr元素中的任何东西。所以，没有改变arr中的任何值。

那怎么改呢？

那么，直接改变list指向对象中的元素，可以实现对于arr中的元素的改变：

let arr = [
  {   name: '1',
      id: '1'
  },{ name: '2',
      id: '2'
  },{   name: '3',
      id: '3'
  }
]
arr.forEach(list=>{
  if(list.name==='2'){
    list.name = 'zding'
  }
})

console.log(arr)

这样就能得到期望的输出：

[[object Object] {
  id: "1",
  name: "1"
}, [object Object] {
  id: "2",
  name: "zding"
}, [object Object] {
  id: "3",
  name: "3"
}]