JavaScript中的深浅拷贝

深浅拷贝主要是在变量赋值操作中出现的一个问题。这个问题之所以会出现是因为在JavaScript中对基本数据类型和复杂数据类型的处理方式不同。

1.JavaScript中数据类型的介绍

1. 基本数据类型
   指的是简单的数据段，包括布尔类型、数值类型、字符串类型、undefined、null。基本数据类型存储在栈当中，在变量中只能存储一个单元的数据。
2. 复杂数据类型
   又称作引用数据类型，指的是一个对象保存在堆内存中的地址，且不能直接操作堆中存储的内存地址，只能操作对象在栈内存中的引用地址。
   所以在赋值操作时，就会出现两个变量占用同一个人内存地址的现象，所以在其中一个变量变化时，另一个变量也会发生改变。所以为了解决这个问题，JavaScript给出了解决方案。

2.基本数据类型的赋值操作

// a1中存储的是 world
var a = 'world';
// 将str1中存储的数据world赋值给b 
var b = a;
// 之后对a 的操作与b无关
str1 = 'hello';
console.log(a , b);

输出结果：

3.复杂数据类型的赋值操作

// arr1 变量中存储的是：数组的内存地址
var arr1 = [1,2,3,4,5];
// 将arr1 存储的内存地址赋值给arr2后,两个变量存储的是相同的内存地址
var arr2 = arr1;
arr1[0] = '999';
console.log(arr2);

输出结果：

由上面图片可以看出arr1操作数组时，arr2也会被影响而发生改变。这是因为arr1和arr2,同时存储的是相同的内存地址,操作的也是同一个数组。同理,arr2操作数组时,arr1也会被影响。
这种直接将一个引用数据类型的内存地址赋值给另一个变量存储的,称为浅拷贝。
在很多时候，进行赋值操作时不想让两个变量同时改变,就要建立一个独立的变量,复制复杂数据类型中的数据内容。
这种只复制引用数据类型中的数值而不复制内存地址的操作方法称为深拷贝。

// 只复制arr3中的数据
var arr3 = [1,2,3,4,5];
// 循环遍历,获取arr3中的所有数据数值,赋值到新的数组中
var arr4 = [];
// 通过循环,生成arr3的所有索引下标
for(var i = 0 ; i <= arr3.length-1 ; i++){
   // arr3[i] 就是获取arr3中存储的数据信息
   // arr4.push() 将arr3中的数据 arr3[i] , 写入到 arr4中
    arr4.push(arr3[i]);
}
arr3[0] = '999';
console.log(arr3 , arr4);

总结

1.基本数据类型中:赋值的是存储的数据，赋值之后 两个变量没有关系，互不影响。
2.复杂数据类型中：
（1）浅拷贝：
直接赋值的是内存地址，赋值之后两个变量使用的内容相同,一个操作时另一个也会改变。
（2）深拷贝：
循环遍历获取的复杂数据类型中存储的每一个数据信息赋值到新的变量中，赋值之后的两个变量没有任何关系。
在我们平时进行的复杂操作中，很多时候都是对复杂数据类型进行赋值操作，所以深浅拷贝的运用还是挺广泛的~