JavaScript第七弹——深入理解浅拷贝与深拷贝

Hello小伙伴们，抱歉这两天没有更文，今天我来将功补过啦，今天的主题是“拷贝”！大家还记得之前说过的数据类型吗，那可是我们今天的基础呢！

数据存储

• 基本数据类型：Undefined，Null，Boolean，Number和String
• 引用数据类型：对象

还记得这个的小伙伴真的是棒棒的呢！但是大家记得分别是什么数据类型，又知道数据是怎么存储的吗？数据存储方法的不同，会造成数据拷贝方式的不同。

• 基本数据类型： 基本数据类型的值在内存中存储与栈内存中，并占据着固定大小的空间。一个变量向另一个变量复制基本类型的值，就会创建被复制值的副本，基本数据类型的值不能够添加属性。

• 引用数据类型： 引用数据类型是对象，被保存在堆内存中。包含引用类型值的变量实际上包含的不是对象本身，而是一个指向该对象的指针。从一个变量向另一个变量复制引用类型的值时，复制的其实是指针地址而已，因此两个变量最终都指向同一个对象。

那么对于基本类型和应用类型的数据，我们分别要怎样进行拷贝呢？

浅拷贝

对于基本类型的数据来说，我们相当于就是为数据创建一个副本，直接进行浅拷贝就可以了：

var arr1 = [rabbit1, rabbit2, rabbit3, rabbit4];
var arr2 = arr;

深拷贝

相比于浅拷贝来说，深拷贝就复杂得多了。说到深拷贝，这又要分成是对数组对象的拷贝还是普通对象的拷贝，因为数组有自己的特性和函数。

var arr = [1, 2, 3, 4];

• 数组对象：那让我们先隆重请出slice和concat对象！！！ slice：arrayObj.slice(start, [end]) 该方法返回一个 Array 对象，其中包含了 arrayObj 的指定部分。不会改变原数组 var copyArr1 = arr.slice(0); concat：arrayObj.concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。 var copyArr2 = arr.concat();
• 普通对象：为了达到深拷贝的目的，我们就要首先定义新对象，遍历原对象，并把遍历值赋给新对象。 var deepCopy = function(obj) { var result = {}; for(var key in obj) { if(typeof obj[key] === 'object') { result[key] = deepCopy(obj[key]) } else { result[key] = obj[key] } } return result; } 其实这和数组的深拷贝是一样的，数组通过函数实现的也是循环遍历数组内部的值。

好啦，今天的内容就是这么多了，不要看篇幅不大，但是信息量很大哦，大家也可以自己敲一遍，顺便通过更改对象的某个属性值来判断是不是真的实现了深拷贝呢～～

喜欢兔妞的文章请给点个好看让更多人看到呦～～么么哒！！！