js中的浅拷贝、深拷贝

最新推荐文章于 2023-03-21 11:35:19 发布

zjyJul

最新推荐文章于 2023-03-21 11:35:19 发布

阅读量296

点赞数

分类专栏： # Javascript 文章标签： javascript 前端 es6

本文链接：https://blog.csdn.net/zjyJul/article/details/123325553

版权

本文介绍了JavaScript中浅拷贝和深拷贝的区别，浅拷贝只复制对象的表面，而深拷贝会递归复制包括子对象在内的所有内容。浅拷贝的实现方式包括Object.assign()、展开运算符等，深拷贝则可以使用JSON.parse(JSON.stringify())、lodash的_.cloneDeep方法等。赋值操作实际上是两个对象指向同一存储空间，导致联动效果。

摘要由CSDN通过智能技术生成

一、理解

三者的区别如下，不过比较的前提都是针对引用类型:
浅拷贝：
对一个对象进行浅拷贝，重新在堆中创建内存，该对象下的基本类型属性会开辟新的空间；引用类型属性是还是指向同一块空间，会相互影响
在这里插入图片描述

深拷贝：
从堆内存中开辟一个新的区域存放新对象，对对象中的子对象进行递归拷贝,拷贝前后的两个对象互不影响
在这里插入图片描述
赋值：
把一个对象赋值给一个新的变量时，赋的其实是该对象的在栈中的地址，而不是堆中的数据。也就是两个对象指向的是同一个存储空间，因此，两个对象是联动的。

二、实现

1.浅拷贝

代码如下：

		//浅拷贝
        let shallowClone = function(obj){
   
            let newobj = {
   };
            for(let key in obj){
   
                //查找一个对象是否有某个属性，但是不会去查找它的原型链
                if(obj.hasOwnProperty(key)){
   
                    newobj[key] = obj[key];
                }
            }
            return newobj;
        }

        let obj = {
   
            a:"1",
            b:2,
            c:[3,7],
            dog:{
   
                name:"doudou",
                age:1
            }
        }
        let s1