什么是深拷贝和浅拷贝,如何实现

深拷贝与浅拷贝都是针对与引用数据类型来说的;  

 
    浅拷贝只复制一层对象的属性,值引用;应用场景就是:对于只有一层结构的Array,Object想要拷贝一个副本时使用;
   浅拷贝 实现方式:

        1.使用Object.assign({},obj)第一个参数是一个空对象,第二个参数是你要复制的对象;通过这个方法我们知道浅拷贝不能修改基础的数据类型,可以修改引用的数据类型;
        2.ES6中的...扩展运算符来进行浅拷贝的实现;


    深拷贝就是递归复制了所有的层级和地址引用。就是拷贝多层,每一级别的数据都会别拷贝出来;应用场景就是复制深层次的object的数据结构;
    深拷贝实现方式

        1.利用JSON.parse(JSON.stringify(obj));就是先将这个对象转换为字=  符串,再将字符串转换为一个对象,这样就实现了一个深拷贝的原理;
        2.通过定义一个函数deep来实现,他的参数是一个obj对象,函数里面第一步先判断参数obj是否为一个对象,如果不是就返回return false;如果是的话就定义一个空的数组作为存储空间;

        随后在遍历obj,如果内容是一个对象的话就把循环的当前项添加到上面创建的新数组中;最后在返回这数组;然后要是需要进行深拷贝的话就调用这个函数;

        3.利用递归调用

var obj = {   //原数据,包含字符串、对象、函数、数组等不同的类型
       name:"test",
       main:{
           a:1,
           b:2
       },
       fn:function(){
           
       },
        friends:[1,2,3,[22,33]]
   }

   function copy(obj){
        let newobj = null;   //声明一个变量用来储存拷贝之后的内容
        
     //判断数据类型是否是复杂类型,如果是则调用自己,再次循环,如果不是,直接赋值即可,
     //由于null不可以循环但类型又是object,所以这个需要对null进行判断
        if(typeof(obj) == 'object' && obj !== null){ 
        
	//声明一个变量用以储存拷贝出来的值,根据参数的具体数据类型声明不同的类型来储存
            newobj = obj instanceof Array? [] : {};   
            
	//循环obj 中的每一项,如果里面还有复杂数据类型,则直接利用递归再次调用copy函数
            for(var i in obj){  
                newobj[i] = copy(obj[i])
            }
        }else{
            newobj = obj
        }    
      return newobj;    //函数必须有返回值,否则结构为undefined
   }

    var obj2 = copy(obj)
    obj2.name = '修改成功'
    obj2.main.a = 100
   console.log(obj,obj2)

        4.lodash插件

https://blog.csdn.net/chern1992/article/details/106782191?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522169016950416800222890261%2522%252C%2522scm%2522%253A%252220140713.130102334..%2522%257D&request_id=169016950416800222890261&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduend~default-2-106782191-null-null.142^v90^chatsearch,239^v3^insert_chatgpt&utm_term=lodash%E5%AE%9E%E7%8E%B0%E6%B7%B1%E6%8B%B7%E8%B4%9D&spm=1018.2226.3001.4187https://blog.csdn.net/chern1992/article/details/106782191?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522169016950416800222890261%2522%252C%2522scm%2522%253A%252220140713.130102334..%2522%257D&request_id=169016950416800222890261&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduend~default-2-106782191-null-null.142%5Ev90%5Echatsearch,239%5Ev3%5Einsert_chatgpt&utm_term=lodash%E5%AE%9E%E7%8E%B0%E6%B7%B1%E6%8B%B7%E8%B4%9D&spm=1018.2226.3001.4187

        5.Object.assgin

const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}


        

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值