克隆

153 阅读1分钟

把一个对象上的属性和方法完全克隆到另一个对象上。

浅层克隆

var obj = {
    name : 'sunny',
    age : 12,
    sex : 'female'
}

var obj1 = {}

//克隆方法
function clone(origin, target) {
    
    //容错,如果没有提供空对象(即target),我们可以提供对象进行克隆
    var target = target || {};
    
    for(var prop in origin){
        target[prop] = origin[prop];
    }
    
clone(obj,obj1);

}

这样子去克隆原始值是没有问题的,但是如果克隆引用值,就会出现问题。

克隆得到的对象里面的引用值与原始值是同一个指向,所以它们会得到相同的结果,但如果修改它们任何一个的值,另一个的值也会改变。这样的克隆并不好,不能独立出来。

深层克隆

  1. 遍历对象
  2. 判断是不是原始值
  3. 判断是数组还是对象
  4. 建立相应的数组或对象
var obj = {
    name : "abc",
    age : 23,
    card : ['visa', 'master'],
    wife : {
        name : "bcd",
        son : {
            name : "aaa"
        }
    }
}
	
var obj1 = {}

//克隆方法
function deepClone(origin, target){
    var target = target || {},
        toStr = Object.prototype.toString,
        arrStr = "[object Array]";
    //遍历对象
    for(var prop in origin){
        //判断是否在原型链上
        if(origin.hasOwnProperty(prop)) {
           //判断是否是原始值
           if(origin[prop] !== "null" && typeof(origin[prop]) == 'object') {
               //判断是数组还是对象
               if(toStr.call(origin[prop]) == arrStr) {
                   target[prop] = [];
                   }
               else{
                   target[prop] = {};
                   }
               //递归
               deepClone(origin[prop], target[prop]);
            }
            else {
               target[prop] = origin[prop];
            }
	}
   }
    return target;
}

看下结果

可以看到克隆之后,在obj的card的中增加一个值,obj1是没有变的。