深拷贝浅拷贝

1.JSON.parse JSON.Stringfy 深拷贝

缺点：它会抛弃对象的constructor，深拷贝之后，不管这个对象原来的构造函数是什么，在深拷贝之后都会变成Object；这种方法能正确处理的对象只有 Number, String, Boolean, Array, 扁平对象，也就是说，只有可以转成JSON格式的对象才可以这样用，像function没办法转成JSON；

  let arr = [{a:1,b:1},{a:2,b:2}]
  let arr3 = JSON.parse(JSON.stringify(arr))
  arr3.push({a:3,b:3})
  arr3[0].a=9
  console.log(arr)   //0: {a: 1, b: 1}   1: {a: 2, b: 2}
  console.log(arr3)  //0: {a: 9, b: 1}   1: {a: 2, b: 2} 2:{a: 3, b: 3}



 let arr1 = [1,2,3,4]
 let arr2 =JSON.parse(JSON.stringify(arr1))
 arr1[0]=5
 console.log(arr1)  //[5, 2, 3, 4]
 console.log(arr2)  //[1, 2, 3, 4]


 let obj1 = {
            fun: function () {
                alert(123);
            }
        }
        let obj2 = JSON.parse(JSON.stringify(obj1));
        console.log(typeof obj1.fun); // function
        console.log(typeof obj2.fun); // undefined

2.Object.assign（）

缺点：实现一层深拷贝

     let arr3 = [{a:1,b:1},{a:2,b:2}]
     let arr4 = Object.assign([],arr3)
     arr4.push({ a: 3, b: 3 })
     arr3[0].a=3
     console.log(arr3)  //0: {a: 3, b: 1}   1: {a: 2, b: 2}
     console.log(arr4)  //0: {a: 3, b: 1}   1: {a: 2, b: 2}  {a: 3,b: 3}
  
    let arr1 = [1,2,3,4]
    let arr2 =Object.assign([],arr1)
    arr1[0]=5
    console.log(arr1)  //[5, 2, 3, 4]
    console.log(arr2)  //[1, 2, 3, 4]



 var obj1 = {
            a: 1,
            b: 2,
            c: 3
        }
        var obj2 = Object.assign({}, obj1);
        obj2.b = 5;
        console.log(obj1.b); // 2
        console.log(obj2.b); // 5

        var obj1 = {
            a: 1,
            b: 2,
            c: ['a', 'b', 'c']
        }
        var obj2 = Object.assign({}, obj1);
        obj2.c[1] = 5;
        console.log(obj1.c); // ["a", 5, "c"]
        console.log(obj2.c); // ["a", 5, "c"]

3. …扩展运算符

缺点：实现一层深拷贝

let arr = [{ a: 1, b: 1 }, { a: 2, b: 2 }]
let arr3 = [...arr]
arr3.push({ a: 3, b: 3 })
arr3[0].a = 9
console.log(arr)   //0: {a: 9, b: 1}   1: {a: 2, b: 2}
console.log(arr3)  //0: {a: 9, b: 1}   1: {a: 2, b: 2} 2:{a: 3, b: 3}

let arr1 = [1,2,3,4,[0,6]]
let arr2 =[...arr1]
arr2[0]=5
arr2[4][0] = 7
console.log(arr1) //[1, 2, 3, 4, [7,6]]
console.log(arr2)  //[5, 2, 3, 4, [7,6]]

4.concat()方法

缺点：实现一层深拷贝

        let arr = [{ a: 1, b: 1 }, { a: 2, b: 2 }]
        let arr3 = [].concat(arr)
        arr3.push({ a: 3, b: 3 })
        arr3[0].a = 9
        console.log(arr)   //0: {a: 9, b: 1}   1: {a: 2, b: 2}
        console.log(arr3)  //0: {a: 9, b: 1}   1: {a: 2, b: 2} 2:{a: 3, b: 3}


        let arr1 = [1,2,3,4,[0,6]]
        let arr2 = [].concat(arr1)
        arr2[0]=5
        arr2[4][0] = 7
        console.log(arr1) //[1, 2, 3, 4, [7,6]]
        console.log(arr2)  //[5, 2, 3, 4, [7,6]]

5.slice方法

下面代码中，最后一个例子slice没有参数，实际上等于返回一个原数组的拷贝。
缺点：实现一层深拷贝

var a = ['a', 'b', 'c'];

a.slice(0) // ["a", "b", "c"]
a.slice(1) // ["b", "c"]
a.slice(1, 2) // ["b"]
a.slice(2, 6) // ["c"]
a.slice() // ["a", "b", "c"]

6.JQ的extend方法

$.extend( [deep ], target, object1 [, objectN ] )
deep表示是否深拷贝，为true为深拷贝，为false，则为浅拷贝
target Object类型 目标对象，其他对象的成员属性将被附加到该对象上。
object1 objectN可选。 Object类型 第一个以及第N个被合并的对象。

        let a = [0, 1, [2, 3], 4],
            b = $.extend(true, [], a);
        a[0] = 1;
        a[2][0] = 1;
        console.log(a);  // [1,1,[1,3],4]
        console.log(b)   //[0,1,[2,3],4]

7.自定义函数

// 定义一个深拷贝函数  接收目标target参数
function deepClone(target){
    // 定义一个变量
    let result;
    // 如果当前需要深拷贝的是一个对象的话
    if (typeof target === 'object') {
    // 如果是一个数组的话
        if (Array.isArray(target)) {
            result = []; // 将result赋值为一个数组，并且执行遍历
            for (let i in target) {
                // 递归克隆数组中的每一项
                result.push(this.deepClone(target[i]))
            }
         // 判断如果当前的值是null的话；直接赋值为null
        } else if(target===null) {
            result = null;
         // 判断如果当前的值是一个RegExp对象的话，直接赋值    
        } else if(target.constructor===RegExp){
            result = target;
        }else {
         // 否则是普通对象，直接for in循环，递归赋值对象的所有值
            result = {};
            for (let i in target) {
                result[i] = this.deepClone(target[i]);
            }
        }
     // 如果不是对象的话，就是基本数据类型，那么直接赋值
    } else {
        result = target;
    }
     // 返回最终结果
    return result;
}



        let arr1 = [1,2,3,4,[0,6]]
        let arr2 =deepClone(arr1)
        arr2[0]=5
        arr2[4][0] = 7
        console.log(arr1) //[1, 2, 3, 4, [0,6]]
        console.log(arr2)  //[1, 2, 3, 4, [7,6]]


        let arr = [{ a: 1, b: 1 }, { a: 2, b: 2 }]
        let arr3 = deepClone(arr)
        arr3.push({ a: 3, b: 3 })
        arr3[0].a = 9
        console.log(arr)   //0: {a: 1, b: 1}   1: {a: 2, b: 2}
        console.log(arr3)  //0: {a: 9, b: 1}   1: {a: 2, b: 2} 2:{a: 3, b: 3}