ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

深拷贝和浅拷贝

2022-07-25 21:35:38  阅读:137  来源: 互联网

标签:obj1 obj 对象 hobby 拷贝 const


深拷贝和浅拷贝

浅拷贝

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

实现方式

  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.  

标签:obj1,obj,对象,hobby,拷贝,const
来源: https://www.cnblogs.com/wnayu/p/16518892.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有