我们先来看下第一段代码:
将第一段代码放入浏览器控制台执行完之后,打印数组arr1
接着我们来看下第二段代码:
将第二段代码放入浏览器控制台执行完之后,打印数组arr2:
我们可以发现arr2中 [id = 1] 的元素并没有被替换成我们期望
当然,最后我会说怎么在forEach遍历过程中去替换原数组中的元素,现在我们先来讨论下,为什么会出现 [id = 1] 的元素为什么没有被替换掉:
要想探究原因,我们就得将上述数组用照妖镜照一照,看看它的真面目究竟是如何
js中的数组类型,分为两大类,
一类是值类型 数值、布尔值、null、undefined
一类是引用类型 对象、数组、函数
看下面代码,简单说明js字面量创建对象的过程 :
理解了上述js创建过程,那么我们来揭开arr2数组的真实面纱
看到arr2的真实面目,相信各位小伙伴应该明白了,上面展示的第二段代码为什么无效
可能有些初学小伙伴有疑问,既然我们在遍历的过程中拿到的是一个内存地址,那么在最开始第一段代码中,为什么又能将元素{ id: 1, value: 1 }的value值改变为10呢,那么请给我留言,不在这里展开这个问题。
最后总结,forEach和map遍历中 如果想改原数组,通过下面方式就行了
之所以会聊到这个问题,也是团队小伙伴谈到forEach遍历过程中不能修改原数组,但是却不知道为什么不能修改,以及真的要修改,又如何去修改。后面想了下,可能也有其他的小伙伴有时也不太清楚,索性写了篇小记,帮助理解。