JS深拷贝和浅拷贝

最新推荐文章于 2024-05-02 19:37:05 发布

sygence

最新推荐文章于 2024-05-02 19:37:05 发布

阅读量3.5k

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/supposedly/article/details/112974113

版权

JS 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

浅拷贝只是拷贝一层,更深层次对象级别的只拷贝引用。
浅拷贝是拷贝的内存地址，使新对象指向拷贝对象的内存地址。深拷贝是重新开辟一块内存空间，用来存放sources对象的值。
浅拷贝可以用for in 来实现，也可用es6新增方法Object.assign(target,...sources) 来实现，target为目标对象，sources为原对象(要进行拷贝的对象)
浅拷贝后改变target中的值，sources也会进行改变。深拷贝不会这样
深拷贝可以基于函数封装的方法来进行实现。

<body>
    <script>
        var obj = {
            id: 1,
            name: 'andy',
            msg: {
                age: 18
            }
        };
        var o = {};
        var j = {};
        function shallowCopy(newobj, oldobj) {
            for(var k in oldobj){
                newobj[k] = old[k];
            }
        }
        shallowCopy(o, obj);
        console.log('o',o)
        o.id = 2;
        console.log('obj',obj)
        //封装深拷贝函数
        function deepCopy(newobj, oldobj) {
            for (var k in oldobj) {
                //判断属性值属于那种数据类型
                //1.获取属性值 old[k]
                var item = oldobj[k];
                //2. 判断这个值是否是数组
                //必须先判断是否是Array 因为Array 也是Object
                if(item instanceof Array){
                    newobj[k] = [];
                    deepCopy(newobj[k], item);
                }else if(item instanceof Object){
                    //3.判断这个值是否是对象
                    newobj[k] = {};
                    deepCopy(newobj[k], item);
                } else {
                    //4.属于简单数据类型
                    newobj[k] = item;
                }
            }
        }
        deepCopy(j,obj);
        console.log('j',j);
        j.id = 4;
        console.log('obj',obj);
    </script>
</body>

存在不足之处可随时补充。

学习地址

sygence

关注

0
点赞
踩
17

收藏

觉得还不错? 一键收藏
0
评论
JS深拷贝和浅拷贝

浅拷贝只是拷贝一层,更深层次对象级别的只拷贝引用。浅拷贝是拷贝的内存地址，使新对象指向拷贝对象的内存地址。深拷贝是重新开辟一块内存空间，用来存放sources对象的值。浅拷贝可以用for in 来实现，也可用es6新增方法Object.assign(target,...sources) 来实现，target为目标对象，sources为原对象(要进行拷贝的对象) 浅拷贝后改变target中的值，sources也会进行改变。深拷贝不会这样深拷贝可以基于函数封装的方法来进行实现。<b...
复制链接

扫一扫