js 对象深复制

小灰灰 2023-07-06 11:56 4阅读 0赞

深复制：源对象的属性如果有对象，该对象属性修改后，不会引起复制后的对象各属性的改变，源对象的任何属性及子属性，与新对象的没有任何引用关系。

简单来说就一句话，新对象与原对象，除了长得一样外，没有任何引用关系，两边更新修改互不影响。

var obj = { 
        a: 1,
        b: "a",
        c: true,
        d: function (a, b) { 
            if (a > 10) a = 10;
            if (b > 5) { 
                b = 5;
            } else if (b < 0) { 
                b = 0;
            }
            console.log(a + b);
        },
        e: [1, 2, 3, 4],
        f: { 
            g: ["a", "b", "c"],
            h: new Date(),
            i: /^[a-z]+$/g,
            j: { 
                k: { 
    
                },
                l: [true, false],
                m: [
                    {  id: 1001, name: "abc1" },
                    {  id: 1002, name: "abc2" },
                    {  id: 1003, name: "abc3" }
                ]
            }
        }
    }
    Object.defineProperties(obj.f.j, { 
        n: { 
            value: function () { 
                console.log("abcd");
            }
        },
        o: { 
            value: 10,
            enumerable: true
        },
        p: { 
            value: [1, 2, 3],
            writable: true
        },
        q: { 
            value: true,
            writable: true,
            enumerable: true
        }
    });
    
    Object.defineProperties(obj.f.j.k, { 
        r: { 
            value: function () { 
    
            },
            writable: true
        },
        s: { 
            value: {  a: 1 },
            enumerable: true
        }
    });
    // console.log(obj);
    
    var obj1 = cloneObject(obj);
    
    obj.f.j.p[2] = 10;
    console.log(obj, obj1);
    
    function cloneObject(sourceObj, targetObj) { 
        // targetObj=targetObj || {};
        if (!targetObj) { 
            // sourceObj.constructor就是 sourceObj的类型
            // sourceObj是数组 sourceObj.constructor->Array new Array();
            targetObj = new sourceObj.constructor();
            switch (sourceObj.constructor) { 
                case RegExp:
                    targetObj = new RegExp(sourceObj.source, sourceObj.flags);
                    break;
                case Date:
                    targetObj = new Date(sourceObj);
                    break;
            }
        }
        var names = Object.getOwnPropertyNames(sourceObj);
        for (var i = 0; i < names.length; i++) { 
            // console.log(names[i],sourceObj[names[i]]);
            // console.log(typeof sourceObj[names[i]]);
            var desc = Object.getOwnPropertyDescriptor(sourceObj, names[i]);
            if (typeof desc.value === "object") { 
                var o = cloneObject(desc.value);
                Object.defineProperty(targetObj, names[i], { 
                    enumerable: desc.enumerable,
                    configurable: desc.configurable,
                    writable: desc.writable,
                    value: o
                });
            } else if (typeof desc.value === "function") { 
                var fnStr = desc.value.toString().replace(/\n/g, "");
                var arg = fnStr.match(/\((.*?)\)/)[1];
                var content = fnStr.match(/{(.*)}/)[1];
                var fn = new Function(arg, content);
                Object.defineProperty(targetObj, names[i], { 
                    enumerable: desc.enumerable,
                    configurable: desc.configurable,
                    writable: desc.writable,
                    value: fn
                });
            } else { 
                Object.defineProperty(targetObj, names[i], desc);
            }
        }
        return targetObj;
    }

目标对象（新对象）与原对象，所有的属性一模一样，而且，更改新对象的任何属性，不会影响原对象的属性值。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzI5NzMyMQ_size_16_color_FFFFFF_t_70]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzI5NzMyMQ_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200218195649267.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzI5NzMyMQ==,size_16,color_FFFFFF,t_70

发表评论取消回复

表情：

评论列表（有 0 条评论，4人围观）

还没有评论，来说两句吧...

相关阅读

相关深复制

//要复制的实例必须可序列化，包括实例引用的其它实例都必须在类定义时加[Serializable]特性。 public static T DeepC

淡淡的烟草味﹌/ 2023年10月17日 12:56/ 0 赞/ 4 阅读

相关 js 对象深复制

深复制：源对象的属性如果有对象，该对象属性修改后，不会引起复制后的对象各属性的改变，源对象的任何属性及子属性，与新对象的没有任何引用关系。简单来说就一句话，新对象与原对象，

小灰灰/ 2023年07月06日 11:56/ 0 赞/ 5 阅读

相关 java实现对象的浅复制与深复制

浅复制：只对对象以及变量值进行复制，引用对象地址不变深复制：不仅对对象以及变量值进行复制，对引用对象也复制 import java.io.;

约定不等于承诺〃/ 2023年07月05日 13:26/ 0 赞/ 3 阅读

相关 js对象的深拷贝

1、利用json转换，但是对象中的键不能为本身 function cloneJson(o) { return J

￡神魔★判官ぃ/ 2023年01月22日 14:53/ 0 赞/ 206 阅读

相关 python对象的浅复制和深复制介绍

python对象的浅复制和深复制介绍首先了解几个概念变量：是系统变量名表中的元素，通常是由程序员进行定义声明。对象：是计算机分配的一块内存，需要足够的

布满荆棘的人生/ 2022年10月14日 14:54/ 0 赞/ 201 阅读

相关 Java对象的深复制和浅复制

链接：[http://my.oschina.net/xianggao/blog/394295?fromerr=5xMat4v4][http_my.oschina.net_xia

小鱼儿/ 2022年09月23日 03:48/ 0 赞/ 194 阅读

相关 js的浅复制和深复制

1.来看一个例子(浅复制) var test={ zcj:'isGood'} var test2=test test.zcj='isLo

爱被打了一巴掌/ 2022年05月30日 09:08/ 0 赞/ 272 阅读

相关 JS案例：继承和深复制

继承： // 寄生式继承(圣杯) Father.prototype.name = 'Hello' //在Father类中添加一个name属性

- 日理万妓/ 2022年04月01日 11:20/ 0 赞/ 101 阅读

相关 js复制数组的问题（浅复制和深复制）

首先说两个概念：浅度克隆：原始类型为值传递，对象类型仍为引用传递。深度克隆：所有元素或属性均完全复制，与原对象完全脱离，也就是说所有对于新对象的修改都不会反映到原对象中

男娘i/ 2021年09月24日 17:22/ 0 赞/ 371 阅读

相关 js对象的深复制和浅复制

在JavaScript中，复制对象分为两种方式，浅复制和深复制，浅复制只复制一层对象的属性，而深复制则递归复制了所有层级 1、浅复制没有办法去真正的去复制一个对象，而只是保

「爱情、让人受尽委屈。」/ 2021年09月18日 03:30/ 0 赞/ 427 阅读