修改JS数组中的一个对象的元素的值，其他对象的元素值都跟着变了_js 对象中数组属性修改,其余不改变

// this.xAxis是一个数组对象，给数组添加新属性，输出新数组
for (let i=0;i<count;i++){
     this.xAxis.data=data;
     this.xAxis.gridIndex=i;
     Data.push(this.xAxis);
 }
 console.log(Data)
 this.xAxis = Data;
1
2
3
4
5
6
7
8

我添加this.xAxis.gridIndex新的属性和值，最后输出添加的属性和值都为最后一遍循环

原因：由于数组是引用变量 ,进行引用赋值 , 其实还是原来的数组 , 也就是说 ,我赋值给this.xAxis里的key其实一直都是同一个地址里存的同一个数组 , 所以 ,最后一次修改name后 ,每个引用都一起改掉了。

解决方案：

// this.xAxis是一个数组对象，给数组添加新属性，输出新数组
for (let i=0;i<count;i++){
     this.xAxis.data=data;
     this.xAxis.gridIndex=i;
     Data.push(JSON.parse(JSON.stringify(this.xAxis)));
 }
 console.log(Data)
 this.xAxis = Data;
1
2
3
4
5
6
7
8

原理就是先把数组转换成字符串再转换成对象 ,这样会新分配一块内存新创建一个对象 ,问题解决 ,这是一个基础坑