为什么在forEach中直接重新赋值迭代参数无法修改原数组元素？

为什么直接给迭代的item赋值无法修改原数组 #

JS 中所有函数参数都是按值传递，引用类型的传值本质是传递「内存地址的副本」。
forEach回调中的item是回调作用域内的局部变量，它存储的只是原数组对应元素指向对象的内存地址拷贝。你执行item = { ...item, ...changes }时，只是把这个局部变量的指向改成了新创建的对象，完全不会修改原数组中存储的内存地址，因此原数组不会发生变化。

为什么通过索引items[i]赋值可以修改原数组 #

items[i]是直接访问数组本身的存储空间，给items[i]赋值相当于直接修改数组对应位置存储的内存地址，把它指向你新创建的对象，自然会直接修改原数组的内容。

数组对象更新的最优方案 #

items[i]原地赋值的方案本身没有问题：如果你明确需要原地修改原数组，这种写法逻辑清晰、性能开销低，是合理的方案。
但在当前主流的前端开发场景下（尤其是使用React、Vue等响应式框架，或者Redux、Pinia等状态管理工具时），更推荐采用不可变更新的方案，即不修改原数组，返回一个全新的数组，避免副作用导致的不可预期问题，最优写法是使用map方法：

const newItems = items.map(item => ({
  ...item,
  ...changes
}))

不可变更新的优势主要有：

• 无副作用，原数组保持不变，便于排查问题和做状态回溯
• 符合主流框架和状态管理的更新规则，能正确触发响应式更新
• 代码更简洁，不需要手动处理索引和遍历逻辑

内容的提问来源于stack exchange，提问作者cup_of