前端深拷贝与浅拷贝

前端深拷贝与浅拷贝

1.浅拷贝

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

2.深拷贝（只能拷贝一层）

 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.深拷贝

 // 定义一个深拷贝函数  接收目标target参数
        function deepClone(target) {
            // 定义一个变量
            let result;
            // 如果当前需要深拷贝的是一个对象的话
            if (typeof target === 'object') {
                // 如果是一个数组的话
                if (Array.isArray(target)) {
                    result = []; // 将result赋值为一个数组，并且执行遍历
                    for (let i in target) {
                        // 递归克隆数组中的每一项
                        result.push(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] = deepClone(target[i]);
                    }
                }
                // 如果不是对象的话，就是基本数据类型，那么直接赋值
            } else {
                result = target;
            }
            // 返回最终结果
            return result;
        }


        // 对象obj1
        let obj1 = {
                a: {
                    c: /a/,
                    d: undefined,
                    b: null
                },
                b: function() {
                    console.log(this.a)
                },
                c: [{
                        a: 'c',
                        b: /b/,
                        c: undefined
                    },
                    'a',
                    3
                ]
            }
            // 对象obj2
        let obj2 = deepClone(obj1);
        console.log(obj2);