JavaScript中的深拷贝与浅拷贝

**

JavaScript中的深拷贝与浅拷贝

**
js中的内存分为栈内存与堆内存

栈内存的六种数据类型:String Number Boolean undefined null Symbol
栈内存会开辟出一个新的空间存放数据,因此当a的值发生变化时,b的值不会改

let a = 10;
let b = a;
a = 20

b的值不会改,依旧还是10

堆内存的三种数据类型: Object Array Function
堆内存数据的复制只是指向了同一个存放数据的地址,所以当改变其中一个的时候,所有的都会改变,这就是浅拷贝
例如:

 let a = [1, 2, 3, 4];
 let b = a;
 a[0] = 5;
 console.log(b);

会发现b变成了[5, 2, 3, 4];

深拷贝: 拷贝对象各个层级的属性,也就是新的对象拥有新的内存,不再互相影响
可用js中JSON.stringify()和JSON.parse()来实现深拷贝
原理就是先利用JSON.stringify()将对象转变成基本数据类型,然后使用了基本类型的拷贝方式,再利用JSON.parse()将这个字符串还原成一个对象完成深拷贝
例如:

 let a = [1, 2, 3, 4];
 let strA = JSON.stringify(a);
 let b = JSON.parse(strA);       
 a[0] = 5;
 console.log(b);

此时b就不会发生改变依旧是[1, 2, 3, 4]

可将其封装为一个函数

function deepCopy(obj) {
	return JSON.parse(JSON.stringify(obj));
}
	   
let b = deepCopy(a);

即可完成深拷贝

上一篇:Vue之qs库安装及使用方法


下一篇:axios使用post提交方式