JavaScript-深度克隆

浅克隆:被复制对象的所有变量都含有与原来的对象相同的值,而所有的对其他对象的引用仍然指向原来的对象。

深度克隆:复制对象的所有变量都含有与原来的对象相同的值,除去那些引用其他对象的变量。那些引用其他对象的变量将指向被复制过的新对象,而不再是原有的那些被引用的对象,也就与原来对象没有任何关联了。

深度克隆的关键是对引用值的处理。

我们可以把深度克隆分成4个部分

1:遍历被克隆对象的所有属性和方法

2:进行判断是否为引用值

3:判断是数组还是对象

4:递归调用克隆函数


那我们来解决这个四个部分就好了。

1:遍历对象很简单,直接for in 循环就好了。

2:判断是否为引用值只需要判断是否为对象,直接调用typeof就好了,不是object那么就是原始值或者null

3:判断是数组还是对象,有几种方法。点击打开链接

4:继续调用克隆函数就好了。

代码如下:

        var deepclone=(function () {
            var str='[obejct Array]';
            return function(target,origin) {
                target=target||{};//防止传的不是对象,就换成对象。
                for (var key in origin) {
                    if (origin.hasOwnProperty(key)) {//不需要复制原型上面的
                        if (origin[key]!==null&&typeof(origin[key])==='object') {
                            if (Object.prototype.toString.call(origin[key])===str) {//是数组
                                target[key]=[];
                            }
                            else {
                                target[key]={};
                            }
                            deepclone(target[key],origin[key]);//递归调用
                        }
                        else target[key]=origin[key];
                    }
                }
            }
        }());

检验代码:

        var obj={
            name:'cyl',
            age:19,
            sex:'male',
            classmate: ['dpc','wdf','rj'],
            Teacher: {
                name:'lsx',
                age:'50',
                sex:'male'
            }
        }
        var deepclone=(function () {
            var str='[obejct Array]';
            return function(target,origin) {
                target=target||{};
                for (var key in origin) {
                    if (origin.hasOwnProperty(key)) {
                        if (origin[key]!==null&&typeof(origin[key])==='object') {
                            if (Object.prototype.toString.call(origin[key])===str) {
                                target[key]=[];
                            }
                            else {
                                target[key]={};
                            }
                            deepclone(target[key],origin[key]);
                        }
                        else target[key]=origin[key];
                    }
                }
            }
        }());
        var son={};
        deepclone(son,obj);

运行结果:

我们发现改变son对obj没有任何影响,深度克隆成功了。



猜你喜欢

转载自blog.csdn.net/wust_cyl/article/details/79885928