js之克隆

克隆这个词语,从表面上我们都能明白啥意思,就不多说了,直接介绍算法实现。

克隆克隆的是对象。

克隆分为浅度克隆和深度克隆。

浅度克隆

copy原始值。

用到的知识:  对象枚举(对象遍历)点击了解对象枚举

 var obj = {
        name : 'abc',
        age : 123,
        sex : 'female',
    }
    var obj1 = {}
    function Clone(origin, target){
        var target = target || {};  //如果用户不提供target
        for(var prop in origin){
            target[prop] = origin[prop];
        }   
        return target;
    }
    Clone(obj1,obj);

深度克隆

copy引用值

用到的知识:对象枚举、递归

数组也是特殊的对象,也可以实现遍历

过程:

1、遍历对象
2、判断属性是否是自己的属性  ----> hasOwnproperty
3、考虑属性  : null的情况
4、判断原始值还是引用值    -----> typeof();  'object'
5、判断引用值里面是数组 还是 对象  ---> toString.call()    {} or []
6、创建对应数组或对象    

7、递归  

function deepClone(origin, target){
    var target = target || {};
    var toStr = Object.prototype.toString;
    for(var prop in origin){
        if(origin.hasOwnProperty(prop)){
            if(origin[prop] === null){
                target[prop] = origin[prop];
            }
            else {
                if(typeof(origin[prop]) == 'object'){
                    if(toStr.call(origin[prop]) == '[object Array]'){
                         target[prop] = [];
                    }
                    else {
                         target[prop] = {};
                    }
                    deepClone(origin[prop], target[prop]);
                    // target[prop] = (toStr.call(origin[prop]) == '[object Array]') ? [] : {};  //三目运算
                }
                else{
                    target[prop] = origin[prop];  //出口
                }
            }
        }
    }
    return target;
}


deepClone(obj, obj1);

obj1里面的属性改变不会影响到obj里面的属性。


补充一个三目运算符。

三目运算符
条件判断? 是 :否 并且会返回值
var num = 1 > 0 ? 2 + 2 : 1 + 1;  //----->4
var num = 1  > 0 ? ('10' > '9' ? 1 : 0) : 2;  //0
字符串比较:逐位比较ASCL值  '10' < '9'


猜你喜欢

转载自blog.csdn.net/qq_41713692/article/details/80547720