深拷贝和浅拷贝

2022/7/25 23:25:35

本文主要是介绍深拷贝和浅拷贝,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

深拷贝和浅拷贝

浅拷贝

概念:在拷贝数据的时候只拷贝一层,更深层次的数据只拷贝地址,原对象和拷贝的对象会相互影响

实现方式

  1. Object.assign()

    代码实现:

    const obj = {
                name: '张三',
                age: 18,
                hobby: ['吃饭', '睡觉'],
            }
            const obj1 = {}
            Object.assign(obj1, obj)
            obj.hobby.push('打豆豆')
            console.log(obj, obj1)

    结果如下:

  1. 扩展运算符

    代码实现:

    const obj = {
                name: '李四',
                age: 20,
                hobby: ['篮球', '跑步']
            }
            const obj1 = {
                ...obj
            }
            obj1.name = '王五'
            obj.hobby.push('游泳')
            console.log(obj, obj1)

打印结果:

 

 

总结:上面两个方法都是实现的浅拷贝,可以看到当修改拷贝的对象的基本数据类型时,原对象并不会受到影响,但是当修改原对象的引用数据类型的时候,拷贝的对象也会受到影响。

深拷贝

概念:深拷贝就是无限层级的拷贝,更深层次的数据也不是只拷贝地址,会将整个拷贝,在内存中开辟一个新的地址,深拷贝的原对象和拷贝的对象不会相互影响。

实现方式

  1. JSON方法实现深拷贝

    先将需要拷贝的对象利用JSON.stringify转成字符串,然后再利用JSON.parse将字符串转成对象赋值给新的对象,即可完成深拷贝。

    代码:

    let obj = {
                name: '婉儿',
                age: 18,
                hobby: ['游戏', '躺平']
            }
            let obj1 = JSON.parse(JSON.stringify(obj))
            obj.hobby.push('吃饭')
            console.log(obj, obj1)

    结果:

     

     

这种方法实现深拷贝是存在以下问题的:

① function和undefined会直接丢失

② NaN、infinity和-infinity会变成null

③ RegExp、Error对象只得到空对象

  1. 递归深拷贝

    代码:

    function deepclone(target) {
                if (typeof target === 'object') {
                    let cloneTarget = Array.isArray(target) ? [] : {};
                    for (const key in target) {
                        cloneTarget[key] = deepclone(target[key]);
                    }
                    return cloneTarget;
                } else {
                    return target;
                }
            }
    ​
            let obj = {
                name: '王二',
                age: 30,
                hobby: ['吃', '睡'],
                chidren: {
                    name: '王三',
                    age: 10,
                    hobby: ['玩']
                }
            }
            const obj1 = deepclone(obj)
            obj.hobby.push('玩')
            obj.chidren.name = '赵四'
            console.log(obj, obj1);

    结果:

     

     

这种方法存在循环引用的问题,如果对象中存在循环引用,那么机会进入死循环导致栈溢出。要解决这个问题,可以额外开辟一个存储空间,来存储当前对象和拷贝对象的对应关系。

  1. lodash

    import lodash from 'lodash'
    const obj1 = lodash(obj)
  2.  


这篇关于深拷贝和浅拷贝的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程