【总结】深拷贝与浅拷贝

浅拷贝只拷贝地址,深拷贝拷贝数据,

        var target = {
            tt: 22,
            id:33,
            class:{
                cc:2,
                aa:4,
                bb:9
            }
        }
        console.log(target);
        var obj = {
            id: 1,
            name: 'ss',
            class:{
                aa:3,
                bb:6
            }
        }
        $.extend(target, obj)
        console.log(target);

浅拷贝结果为如下
在这里插入图片描述

  1. 其中target外层的tt是被复制对象不存在的内容,就不会改变;
  2. 外层name是本身没有,但是被复制对象有的内容,会拷贝进去;
  3. 外层id是与被复制对象都有,但值不同的内容,会改变id的地址指向,指向被复制的obj中id的指向,所以会从33变成1;
  4. class是复杂对象,所以class只储存了地址值,当两者不同时,会跟上一条的id一样,改变到被复制的地址,所以从原来的cc、aa、bb变成了obj中的aa、bb,根本原因就是指向都变了,原来的3个对象没有指针连接,已经被回收了;

深拷贝结果如下

        $.extend(true,target, obj)
        console.log(target);
        console.log(obj);

上面是target
在这里插入图片描述

  1. tt同样不会改变;
  2. name同样会被添加;
  3. id同样会被覆盖成新值;
  4. class是复杂对象,会开辟新的内存空间来全部复制一份新的,跟obj里的class完全独立,同时对于class里的对象的复制操作完全跟外层一致,即简单数据类型,直接复制,该添加的添加,该覆盖的覆盖,复杂类型继续开辟新地址重新复制新的对象,有点相对于递归; 所以在class里面的cc不会改变,而aa、bb都变成了新值,因为被覆盖了

改值测试
对完成了浅拷贝的新数据中的简单数据进行修改,检验原数据是否会有影响,
对浅拷贝的新数据中的复杂类型数据进行修改,并检验

        $.extend(target, obj)
        target.id = 77
        console.log(obj);

在这里插入图片描述
可以发现只有新数据中的id变成了77,原数据并不受影响,可知简单数据类型就是直接复制的

下面进行复杂数据的修改

        $.extend(target, obj)
        target.id = 77
        target.class.aa=99
        //obj.class.aa=99
        console.log(obj);

在这里插入图片描述
测试的时候同时对原数据和新数据的aa都进行了修改,均可以改变两者的数据,可以看出浅拷贝确实是只对复杂数据的地址进行复制,根据任一数据路径修改都会改变两者的数据;

下面对深拷贝进行检验

对完成了深拷贝的新数据中的简单数据进行修改,检验原数据是否会有影响,
对深拷贝的新数据中的复杂类型数据进行修改,并检验
在这里插入图片描述

        $.extend(true,target, obj)
        target.id = 77
        target.class.aa=99
        console.log(obj);

同样修改简单数据类型不会改变另一个
在这里插入图片描述
修改复杂类型中的简单数据也不会改变另一个

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值