js 深拷贝的几种方法

一、对象的深拷贝

1.使用递归

function deepClone(obj){
　　let objClone =  Array.isArray(obj) ? [] : {};
　　if (obj && typeof obj === 'object') {
　　　　for(let key in obj){
　　　　　　if (obj[key] && typeof obj[key] === 'object'){ //判断对象的这条属性是否为对象
　　　　　　　　objClone[key] = deepClone(obj[key]); //若是对象进行嵌套调用
　　　　　　}else{
　　　　　　　　objClone[key] = obj[key]
　　　　　　}
　　　　}
　　}
　　return objClone; //返回深度克隆后的对象
}

2.通过 JSON 对象实现深拷贝

function deepClone(obj) {
  return JSON.parse(JSON.stringify(obj));
}

 注意：这种方法实现深拷贝只能深拷贝对象的属性，不能将对对象的方法深拷贝

3.Object.assign()

当对象中只有一级属性，没有二级属性的时候，此方法为深拷贝，但是对象中有对象的时候，此方法，在二级属性以后就是浅拷贝。

二、数组的深拷贝

1. concat(arr1, arr2,....)

   var arr1 = [1,3,4,5,[6]]
   var arr2 = [].concat(arr1)
   arr2.push('string')
   console.log(arr1 === arr2);  //false

注意：当数组中的元素均为一维是深拷贝数组中元素一维以上是值的引用 

2. slice(index1, index2)

参数可以省略

1）没有参数是拷贝数组

2）只有一个参数是从该位置起到结束拷贝数组元素

3）两个参数，拷贝从起始位置到结束位置的元素（不包含结束位置的元素：含头不含尾）

   var arr1 = [1,3,4,5,[6]]
   var arr2 = arr1.slice()
   console.log(arr1 === arr2);  //false

注意：当数组中的元素均为一维是深拷贝数组中元素一维以上是值的引用 

三、利用第三方工具库

1.lodash函数库

// 函数库中的cloneDeep方法
var objects = [{ 'a': 1 }, { 'b': 2 }];
var deep = _.cloneDeep(objects);
console.log(deep[0] === objects[0]); // => false

2.通过jQuery的extend方法实现深拷贝

$.extend( true, object1, object2 ); // 深度拷贝
$.extend( object1, object2 );  // 浅拷贝
//
var array = [1,2,3,4];
var newArray = $.extend(true,[],array);