为什么写：

最近在研讨深浅拷贝，找了许多材料，觉得不是很惬意，所以本身就整理了一份。空话不多说，我们来一同温习一下吧，也愿望留下您宝贵意见。

作甚深浅拷贝？

深拷贝和浅拷贝是只针对Object和Array如许的庞杂范例的

1.浅拷贝：

我们先来看2个栗子：

let a = {
 name: 'azi'
}
let b = a;
b.name = 'zhangsan';
console.log(a.name);  // zhangsan
console.log(b.name); // zhangsan

let a = ['hello','world']
let b = a;
b[1]= 'azi';
console.log(a);  // ["hello", "azi"]
console.log(b); // ["hello", "azi"]

从栗子中可以看出：

a和b指向统一块内存，所以修正个中恣意的值，另一个值都邑随之变化，这就是浅拷贝。

2.深拷贝：

假如给b放到新的内存中，将a的各个属性都复制到新内存里，就是深拷贝。

换句话说，也就是b的属性转变时，a的属性不会随着变化。

经常运用的完成要领有哪些？

1.浅拷贝：

数组：

Array.slice()、
Array.concat()、
…

对象：

Object.assign()、 …

栗子：

// concat concat要领不会转变this或任何作为参数供应的数组，而是返回一个浅拷贝，它包括与原始数组相结合的雷同元素的副本

let arr = ['old', 1, true, null, undefined];
let new_arr1 = arr.concat();
new_arr1[0] = 'new';
console.log(arr) // ["old", 1, true, null, undefined]
console.log(new_arr1) // ["new", 1, true, null, undefined]

// slice slice()要领返回一个从最先到完毕（不包括完毕）挑选的数组的一部分浅拷贝到一个新数组对象

let new_arr2 = arr.slice();
new_arr2[0] = 'new';
console.log(arr) // ["old", 1, true, null, undefined]
console.log(new_arr2) // ["new", 1, true, null, undefined]

// ... 扩大运算符 复制数组时刻, 拓展语句只会举行浅复制, 因而以下所示, 它并不合适复制多维数组 (与Object.assign() 雷同

let new_arr3 = [...arr];
new_arr3[0] = 'new';
console.log(arr) // ["old", 1, true, null, undefined]
console.log(new_arr3) // ["new", 1, true, null, undefined]

// Object.assign() Object.assign要领只会拷贝源对象本身的而且可罗列的属性到目的对象

let obj1 = {a:0, b:{c:0}};
let obj2 = Object.assign({},obj1);
obj2.b.c =2 ;
obj2.a =2 ;
console.log(obj1); // {a:0,b:{c:2}}
console.log(obj2); // {a:2,b:{c:2}}

// ...
let obj3 = {...obj1};
obj3.b.c =3 ;
obj3.a =3 ;
console.log(obj1); // {a:0,b:{c:3}}
console.log(obj3); // {a:3,b:{c:3}}

2.深拷贝：

JSON.parse( JSON.stringify(arr) )

在运用JSON.stringify() 须要注重一下几点：

1.JSON.stringify(..) 在将 JSON 对象序列化为字符串时和 toString() 的结果基础雷同，只不过序列化的结 果老是字符串:

JSON.stringify( 42 ); // “42”
JSON.stringify( “42” ); // “”42″”(含有双引号的字符串)
JSON.stringify( null ); // “null”
JSON.stringify( true ); // “true”

2.一切平安的 JSON 值(JSON-safe)都可以运用 JSON.stringify(..) 字符串化。平安的 JSON 值是指可以呈现为有用 JSON 花样的值。
3.undefined、function、symbol (ES6+)和包括轮回援用(对象之间互相援用，构成一个无穷轮回)的对象都不相符 JSON构造规范，支撑 JSON 的言语没法处置惩罚它们
4.JSON.stringify(..) 在对象中碰到 undefined、function 和 symbol 时会自动将其疏忽，在
数组中则会返回 null(以保证单位位置稳定)。
比方:

 JSON.stringify( undefined ); // undefined
 JSON.stringify( function(){} );  // undefined
 JSON.stringify([1,undefined,function(){},4]); // "[1,null,null,4]"
 JSON.stringify({ a:2, b:function(){} }) // "{"a":2}"

对包括轮回援用的对象实行 JSON.stringify(..) 会失足。

固然也可以用JQ的extend 函数的完成，这里就不详细说了。

参考文档：
冴羽的JavaScript专题之深浅拷贝
Alloyteam深拷贝与浅拷贝的完成