JavaScript学习笔记（五）--深拷贝&浅拷贝

如何区分深拷贝与浅拷贝，简单点来说，就是假设B复制了A，当修改A时，看B是否会发生变化，如果B也跟着变了，说明这是浅拷贝，拿人手短，如果B没变，那就是深拷贝，自食其力。

本篇文章中也会简单阐述到栈堆，引用数据类型，以及json字符串，这些概念能更好的让你理解深拷贝与浅拷贝。

浅拷贝

引用数据类型的变量中保存的是引用地址。即变量的引用地址保存在栈区，真正的值保存在堆区。

var a = {name:"terry",age:"12"};
var b = a;
b.age++;
console.log(a.age); //输出:13

对于以上代码，a的引用地址保存在栈区，并且在堆区有一个内存空间来存储真正的值；将a赋值给b时，相当于把a的引用地址赋给了b，即a和b共用同一块内存空间。此时，变量b属性值的改变也会引起变量a属性值的改变。

这种引用地址的拷贝就被称为浅拷贝，实际操作的是同一块内存地址，就好比给同一套房子配了两把钥匙。

深拷贝【克隆】

深拷贝的实现方法：

• 对象 --> json字符串 --> 对象：JSON.pasre(JSON.stringify(a))；
• 调用es6中object对象的assign方法，把a拷贝到一个空对象中：Object.assign({},a)；
• lodash第三方库；

var a = {name:"terry",age:"12"};
var b = JSON.pasre(JSON.stringify(a));
console.log(b); //输出：{name:"terry",age:"12"}
b.age++;
console.log(a.age); //输出:12
console.log(b.age); //输出:13

对于以上代码，声明一个对象b，将a的属性值以json字符串的方式赋给了b，即为b重新开辟了一块内存空间，此时，a和b的属性值是相同的，但是引用地址指向的是不同的内存空间，改变b的属性值对a不会产生影响。

这种值的拷贝就被称为深拷贝，实际是又开辟了一片内存地址，就好比又买了一套相同户型的房子。

看到这里，相信大家都了解了深拷贝与浅拷贝的区别，要知道，深拷贝在实际开发中是非常有用的。例如后台返回了一堆数据，你需要对这堆数据做操作，但多人开发情况下，你是没办法明确这堆数据是否有其它功能也需要使用，直接修改可能会造成隐性问题，深拷贝能帮你更安全安心的去操作数据，根据实际情况来使用深拷贝，大概就是这个意思。