浅谈JavaScript 中深拷贝完成的要领

置信人许多进修js的历程中都踩了深拷贝和浅拷贝的坑,深拷贝和浅拷贝的区分我就不再赘述了,本日我来写一下我本身完成深拷贝的种种要领。
比较简单的拷贝体式格局能够借用浏览器的Json对象去完成,先把对象转化为json字符串,在剖析回对象完成深拷贝。详细代码就是JSON.parse(JSON.stringify(target));然则这类比较hack的要领总归不是正路,如今我就来贴两种我本身写的深拷贝代码。

function deepClone(currobj){
    if(typeof currobj !== 'object'){
        return currobj;
    }
    if(currobj instanceof Array){
        var newobj = [];
    }else{
        var newobj = {}
    }
    for(var key in currobj){
        if(typeof currobj[key] !== 'object'){
            newobj[key] = currobj[key];
        }else{
            newobj[key] = deepClone(currobj[key])    
        }
    }
    return newobj
}

第一种天然就是递归,遍历对象的每个属性然后赋值到新对象了,如果有深层次嵌套的对象,递归实行函数。jq中的深拷贝也是用相似要领完成。


    function deepClone(currobj){
        if(typeof currobj !== 'object'){
            return currobj;
        }
        if(currobj instanceof Array){
            var newobj = [];
        }else{
            var newobj = {}
        }
        var currQue = [currobj], newQue = [newobj];
        while(currQue.length){
            var obj1 = currQue.shift(),obj2 = newQue.shift();
            for(var key in obj1){
                if(typeof obj1[key] !== 'object'){
                    obj2[key] = obj1[key];
                }else{
                    if(obj1[key] instanceof Array ){
                        obj2[key] = [];
                    }else{
                        obj2[key] = {}
                    };
                    currQue.push(obj1[key]);
                    newQue.push(obj2[key]);
                }
            }
        }
        return newobj;
    };

上一种递归的体式格局轻易引发内存溢出,特别是对一个比较复杂,层级很深的对象举行深拷贝。所以第二种要领是用轮回去拷贝次级的对象,用两个行列去保留须要拷贝的对象和拷贝目的,应用浅拷贝的道理完成了深拷贝。

然则有时候对象会存在子属性指向本身的题目,构成对象环,我这临时还没有考虑到。

倏忽看到本身这篇文章,实在对象环的题目只须要别将旧数组出栈就好了详细代码:

function deepClone(currobj){
    if(typeof currobj !== 'object'){
        return currobj;
    }
    if(currobj instanceof Array){
        var newobj = [];
    }else{
        var newobj = {}
    }
    var currQue = [currobj], newQue = [newobj], i = 0;
    while(i <= currQue.length - 1){
        var obj1 = currQue[i++],obj2 = newQue.shift();
        for(var key in obj1){
            if(typeof obj1[key] !== 'object'){
                obj2[key] = obj1[key];
            }else{
                if(currQue.includes(obj1[key])){
                    obj2[key] = obj1[key];
                    continue;
                }
                if(obj1[key] instanceof Array ){
                    obj2[key] = [];
                }else{
                    obj2[key] = {}
                };
                currQue.push(obj1[key]);
                newQue.push(obj2[key]);
            }
        }
    }
    return newobj;
};
    原文作者:zzh466
    原文地址: https://segmentfault.com/a/1190000008164601
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞