递归手写深拷贝

￡神魔★判官ぃ 2022-12-17 10:59 189阅读 0赞

**前提：**

> 深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型的。

### 1. 堆栈内存 ###

具体看另一篇博客[数据类型、堆栈存储][Link 1]

### 2. 浅拷贝与深拷贝 ###

深拷贝和浅拷贝的示意图大致如下：![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzYzODk2OA_size_16_color_FFFFFF_t_70_pic_center]

> 浅拷贝只复制指向某个对象的指针，而不复制对象本身，新旧对象还是共享同一块内存。但深拷贝会另外创造一个一模一样的对象，新对象跟原对象不共享内存，修改新对象不会改到原对象。

**赋值和浅拷贝的区别**

**赋值：**

> 把一个对象赋值给一个新的变量时，赋的其实是该对象的在栈中的地址，而不是堆中的数据。也就是两个对象指向的是同一个存储空间，无论哪个对象发生改变，其实都是改变的存储空间的内容，因此，两个对象是联动的。

**浅拷贝：**

> 浅拷贝是按位拷贝对象，它会创建一个新对象，这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型，拷贝的就是基本类型的值；如果属性是内存地址（引用类型），拷贝的就是内存地址 ，因此如果其中一个对象改变了这个地址，就会影响到另一个对象。即默认拷贝构造函数只是对对象进行浅拷贝复制(逐个成员依次拷贝)，即只复制对象空间而不复制资源。

### 手写深拷贝（递归）： ###

/** * 深拷贝 */
    
    const obj1 = { 
        age: 20,
        name: 'xxx',
        address: { 
            city: 'beijing'
        },
        arr: ['a', 'b', 'c']
    }
    
    const obj2 = deepClone(obj1)
    obj2.address.city = 'shanghai'
    obj2.arr[0] = 'a1'
    console.log(obj1.address.city)
    console.log(obj1.arr[0])
    
    /** * 深拷贝 * @param {Object} obj 要拷贝的对象 */
    function deepClone(obj = { }) { 
        if (typeof obj !== 'object' || obj == null) { 
            // obj 是 null ，或者不是对象和数组，直接返回
            return obj
        }
    
        // 初始化返回结果
        let result
        if (obj instanceof Array) { 
            result = []
        } else { 
            result = { }
        }
    
        for (let key in obj) { 
            // 保证 key 不是原型的属性
            if (obj.hasOwnProperty(key)) { 
                // 递归调用！！！
                result[key] = deepClone(obj[key])
            }
        }
    
        // 返回结果
        return result
    }

[Link 1]: https://blog.csdn.net/weixin_43638968/article/details/107588961
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzYzODk2OA_size_16_color_FFFFFF_t_70_pic_center]: /images/20221122/69c8b4d7b4ba4bee800dc93914a92120.png