美文网首页
js中浅拷贝和深拷贝(复制数组或复制对象)

js中浅拷贝和深拷贝(复制数组或复制对象)

作者: 默默无闻的小人物 | 来源:发表于2023-01-30 15:50 被阅读0次

前言

*在js中,数组和对象的复制如果使用=号来进行复制,那只是浅拷贝。如下图演示: *

image

如上,arr的修改,会影响arr2的值,这显然在绝大多数情况下,并不是我们所需要的结果。
因此,数组以及对象的深拷贝就是javascript的一个基本功了。

ps:要实现完全的深层次拷贝,既拷贝所有层级的属性。并且不会丢失数据。只有一种方法,那就是递归遍历所有层。

function deepCopy(obj) {
    let clonedObj;
 
    // 判断直接数据类型
    if (['number', 'string', 'boolean', 'undefined', 'symbol',].includes(typeof obj)
        || obj === null) {
        clonedObj = obj;
        return clonedObj;
    }
 
 
    const constructor = obj.constructor || Object;
    clonedObj = new constructor();
 
 
    Object.entries(obj).forEach(([key, value]) => {
        clonedObj[key] = deepCopy(value);
    })
 
 
    return clonedObj;
}

可能很多人说有很多方法啊,JSON.stringify然后再JSON.parse,这个方法其实也是深拷贝,但是有如下风险

  • 1、如果obj里面有时间对象,则JSON.stringify后再JSON.parse的结果,时间将只是字符串的形式,而不是对象的形式
  • 2、如果obj里面有RegExp,则打印出来是空对象
  • 3、如果对象中有函数或者undefined,则会直接被丢掉
  • 4、如果json里有对象是由构造函数生成的,则会丢掉对象的constructon
  • 5、如果对象中存在循环引用的情况也无法正确实现深拷贝
  • 6、如果对象中存在NAN,则序列化后会变成null

相关文章

  • JS中对象的复制

    JS中的对象复制分为两种情况:深拷贝和浅拷贝。深拷贝和浅拷贝的区别在于对数组和对象的拷贝,对它们拷贝时浅拷贝只是拷...

  • javascript 数组以及对象的深拷贝

    数组的深拷贝在js中,数组和对象的复制如果使用=号来进行复制,那只是浅拷贝。如下图演示: for 循环实现数组的深...

  • java 对象的拷贝

    拷贝:即复制 对象拷贝:即对象复制 java 对象拷贝分类:浅拷贝、深拷贝 java 对象的浅拷贝和深拷贝针对包含...

  • 浅拷贝和深拷贝

    本文参考:JavaScript中的浅拷贝和深拷贝js 深拷贝 vs 浅拷贝深入剖析 JavaScript 的深复制...

  • JS中数组和对象的 深复制(拷贝)与浅复制(拷贝)

    JS中数组和对象的 深复制(拷贝)与浅复制(拷贝) 1.js中有五种简单的数据类型(null,string,und...

  • python中的浅拷贝和深拷贝

    浅拷贝和深拷贝: 浅拷贝 shallow copy 浅拷贝是指在对象复制过程中,只复制一层变量,不会复...

  • 面试题iOS

    面试blog 1、深拷贝浅拷贝:浅拷贝就是拷贝对象的指针,而不复制引用对象本身;深拷贝就是拷贝引用对象本身;浅复制...

  • 前端笔记(二) 对象的深浅拷贝,函数的防抖与节流,函数柯里化 ,

    对象的深浅拷贝 对象的深拷贝与浅拷贝的区别: 浅拷贝:仅仅复制对象的引用, 而不是对象本身。 深拷贝:把复制的对象...

  • iOS全解11:特殊问题

    1、浅拷贝和深拷贝的区别? 浅拷贝:只复制指向对象的指针,指针指向同一个地址,而不复制引用对象本身。深拷贝:复制引...

  • 浅拷贝和深拷贝

    浅拷贝和深拷贝都是只针对Object,Array这样的复杂对象。浅拷贝只复制一层对象的属性,而深拷贝则是递归复制了...

网友评论

      本文标题:js中浅拷贝和深拷贝(复制数组或复制对象)

      本文链接:https://www.haomeiwen.com/subject/ikyacdtx.html