浅谈JS中对象的深拷贝和浅拷贝

浅拷贝和深拷贝的'深浅'主要针对的是对象的‘深度’,常见的对象都是'浅'的,也就是对象里的属性就是单个的属性,而'深'的对象是指一个对象的属性是另一个对象,也就是对象里面嵌套对象,就像嵌套函数一样。

为什么要使用深拷贝和浅拷贝呢?

如果现有var obj1 = {...}这个对象,想要复制对象obj1,一贯的做法就是obj2 = obj1,这时虽然obj2拥有了obj1的所有属性,但obj2却不是自由的,因为它的改动会影响到obj1obj1的改动也会影响到obj2,这不是我们所希望的,所以要用到深拷贝和浅拷贝。

深拷贝和浅拷贝就是为解决对象的直接赋值后依然'连接'的问题,也就是共用一个引用,一个改变会影响到另一个。下面是常见的浅拷贝:

var obj = {
        a:10,
        b:20
    };
    function copy(obj) {
         var newobj={};  
         for(arr in obj){
            newobj[arr]=obj[arr]
         }
         return newobj;
    }
    obj2 = copy(obj); //成功复制出obj
    console.log(obj2); Object {a: 10, b: 20}
    obj2.a = 5; //更改了obj2的a 
    console.log(obj2.a); //5
    console.log(obj.a); //10,obj2的改变不影响obj,说明拷贝后的对象和之前的对象不存在共用一个引用

Paste_Image.png

浅拷贝可以解决常见的现象,但倘若对象不是常见的那种呢?比如说对象里还有子对象,那么用浅拷贝就不够彻底,比如如下代码:

var obj = {
        a: 10,
        b: 20,
        omg: {
            name: 'xuguojun',
            sex: 'male'
        }
     } 
     function copy(obj){
        var newobj = {};
        for(arr in obj){
            newobj[arr] = obj[arr]
        }
        return newobj;
     }
     obj2 = copy(obj);
     console.log(obj2); //成功复制出obj
     obj2.omg.name = 'PDD'; //改变obj2.omg.name的值为'PDD'
     console.log(obj2.omg.name); 
     console.log(obj.omg.name); //obj.omg.name的值也随着改变

Paste_Image.png

上面代码中,拷贝完成后更改了obj2.omg.name,结果obj.omg.name也随之改变,说明omg依然存在共用同一个引用的现象,所以浅拷贝拷贝的并不彻底 。这时候深拷贝就该上场了,它能用递归的思想继续深挖,直到最底层为止。

下面就是深拷贝了:

var obj = {
        a: 10,
        b: 20,
        omg: {
            name: 'xuguojun',
            sex: 'male'
        }
     } 
     function deepcopy(obj){
        var newobj = {};
        for(arr in obj){
            if (typeof obj[arr]==='object' && obj[arr] !== null) {
                newobj[arr] = deepcopy(obj[arr]); //递归,核心代码
            } else {
                newobj[arr] = obj[arr];
            }
        }
        return newobj;
     }
     obj2 = deepcopy(obj);
     console.log(obj2); 
     obj2.omg.name = 'PDD'; 
     console.log(obj2.omg.name); 
     console.log(obj.omg.name);

Paste_Image.png

通过上述代码可看出深拷贝拷贝的非常彻底,做到真正意义上的杜绝共用一个引用的问题。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏C/C++基础

C++ struct与union

编码运行环境:VS2012+Win32+Debug Win32既表示运行平台是Windows 32bits操作系统,又表示生成32bits的应用程序。

741
来自专栏用户2442861的专栏

json格式

  1. “名称/值”对的集合(A collection of name/value pairs)。不同的语言中,它被理解为对象(object),记录(reco...

1502
来自专栏康怀帅的专栏

Redis string 类型

可以是字符串、整数或浮点,统称为元素。对字符串操作,对整数类型加减。 追加 set key value append key 1 get key 赋值 se...

2836
来自专栏菜鸟计划

javascript 闭包详解

一、什么是匿名函数 创建一个函数并将它赋值给变量functionName,这种情况下创建的函数,即匿名函数。(函数表达式就是匿名函数) 二、闭包 1.什么是闭包...

3387
来自专栏Pythonista

封装与扩展性

封装在于明确区分内外,使得类实现者可以修改封装内的东西而不影响外部调用者的代码;而外部使用用者只知道一个接口(函数),只要接口(函数)名、参数不变,使用者的代码...

863
来自专栏张善友的专栏

C# 4.0 Optional Parameters 和Named Parameters

Optional Parameters 是C# 4.0的特色之一,可减少重载函数的数量,却可达到相同的效果,加快开发效率。在使用上就跟C++一样,只需用等号为函...

2047
来自专栏iOSer成长记录

iOS-Strong/Copy修饰词

983
来自专栏Python绿色通道

Python入门三部曲(二)

如果不确定使用del语句还是pop()方法,有一个简单的标准:如果你要从列表中删除的一个元素,且不再以任何方式使用它,就使用del语句;如果你要在删除元素后还能...

1003
来自专栏求索之路

Effective Java笔记(不含反序列化、并发、注解和枚举)

最近把Effective Java复习了一遍,其中有比较多的java最佳实践可以在平时编程中用到。反序列化、并发、注解和枚举这四章没看,并发这本书里讲的比较简...

35011
来自专栏决胜机器学习

Redis专题(二) ——Redis数据类型(2)

Redis专题(二)——Redis数据类型(2) (原创内容,转载请注明来源,谢谢) 四、列表类型(List) 列表类型可以存储一个有序的字符串列表,其存储...

3266

扫码关注云+社区