在什么情况,我们会遇见浅拷贝与深拷贝引发的问题

  • 时间:
  • 来源:互联网
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/qyx189573/article/details/103196534

在我们处理业务逻辑时,我们会遇见从后端返回的数据,我们在前端处理的时候,同一个数据,在一个页面处理不同的业务逻辑时,你会发现当你改变数据的时候,他们共同拥有的数据也会发生改变。这时你会发现,明明我是把那个值赋值给另外一个,然后再次赋值的,为什么我改这个数据,而另外一个数据会跟着改变。
比如

let a=[1,2,3];
let b=a;
let c=a;
let d=c;
d.push(6);
console.log('a',a,'b',b,'d',d);
//结果 a ,[1, 2, 3, 6] b ,[1, 2, 3, 6] d ,[1, 2, 3, 6];
// 你会发现我明明只改了d中的数据,为什么b中的数据也改变了。而我们在业务逻辑中,只需要改d中的数据。
// 我们要得是 这样的结果a ,[1, 2, 3] b ,[1, 2, 3] d ,[1, 2, 3, 6];就要这样处理
let a=[1,2,3];
let b=a;
let c=JSON.parse(JSON.stringify(a));
let d=c;
d.push(6);
console.log('a',a,'b',b,'d',d);
// 我们得到的结果a ,[1, 2, 3] b ,[1, 2, 3] d ,[1, 2, 3, 6];

上面出现两个不同的结果的原因:
大家都清楚浅拷贝是指向同一个存储位置,当你改变他们共同的存储位置数据时,他们的数据也会跟着发生改变。就是b和c中改变其c中的数据,b中也会跟着发生改变,就是浅拷贝。
如何而深拷贝是你即使改变b和c中的某一个数据,另外一个数据也不会发生改变。第二个c 用JSON.parse(JSON.stringify(a)),转一下就完成了深拷贝。所以改变d中的数据a,b都不会发生改变。

本文链接http://element-ui.cn/news/show-135.aspx