JS的foreach方法修改值的问题
问题描述
最近开发过程中,向数组动态插入内容后vue渲染器报错如下:
一般可能认为是v-for的key设置有问题可能重复了,但是检查数据过后发现的问题在于插入后没有对后续的索引值进行更新(不是数组默认索引,而是引用类型内部人工添加的索引字段)
解决方法
1.把v-for中使用人工添加的索引字段值修改成系统默认的数组索引,可避免潜在的更新错误,但是无法修正数据中人工添加的索引字段重复事实,后续还用仍然可能造成问题
2.在插入逻辑后增加手动修改索引字段的逻辑
思考
使用foreach遍历数组时,修改element中的值是否会影响原数组中的值?记忆中对基本类型数据的数组做这样的操作是不会影响的。
实践
添加该逻辑后发现可以影响原数组的字段值。
结论
foreach在遍历时,若数组中的数据是基本类型,如Number, String, Boolean等,修改element的值不会影响原数组;而当数组内数据为引用类型时,如Array,Object,修改element的值会影响原数组一起改变。所以foreach在遍历输出element的时候使用的是浅拷贝模式。