JavaScript之克隆

在JavaScript如何把一个对象的属性和方法完完整整的搬过来到另一个空对象身上，对于继承的使用方法不能完成上述操作，所以我们开始另一种方法----克隆。

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

浅层克隆

       

var obj = {
name : "wang",
age : 20,
say : [1,2,3],
family : {
name :"zhou",
baobao : {
name : "mmm",
}
}
test : function (){
console.log(this.name);
}
}
function alone(Origin,Target){
var Target = Target || {};//防止未传参产生的错误
for(var prop in Origin){
Target[prop] = Origin[prop];
}
return Target;
}
var obj1 = alone(obj);

 浅层克隆把一个对象的属性和方法克隆过来，运用对象遍历的方法 ，不懂得点击这里 原始值和引用值一样。所以会产生克隆过来的引用值和原对象引用值指向是相同的，造成一方改变另一方也会改变。所以就有下面深度克隆的方法。

深度克隆

        深度克隆运用了一些算法 递归，首先进行深度克隆之前呢，明白深度克隆的代码思路就可以写了。

        1.克隆过程中我们用遍历对象的方法，首先我们要用遍历中的hasOwnProperty()方法判断属性和方法是对象本身 还是原型中的，不懂得话，点击这里

        2.在对象中有引用值，首先判断是不是引用值，运用类型转换的知识

        3.判断是数组还是对象

        4.建立相应的数组或者对象

        5.递归

        6.递归终止条件

        7.返回值

        就上面这些步骤，尽量自己用自己的编程思想先写一遍。这里我写个简便的。

var obj = {
      name : "wang",
      age : 20,
      say : [1,2,3],
      family : {
         name :"zhou",
         baobao : {
            name : "mmm",
         }
      }
      test : function (){
           console.log(this.name);
      }
}
function deepAlone(Origin,Target){
    var Target = Target || {};                                                      //防止未传参产生的错误
    var toStr = Object.prototype.toString;                                          //定义变量 方便书写
    var arrStr = '[object Array]';                                                  //定义字符串 用于比较是否为数组
    for(var prop in Origin){                                                        // 原对象遍历
         if(Origin.hasOwnProperty(prop)){                                           //判断属性和方法是原型的还是对象自身的
               if(Origin[prop] !== 'null' && typeof(Origin[prop]) == 'object'){     //判断是否为引用值
                    Target[prop] = toStr.call(Origin[prop]) == arrStr ? [] : {};    //三目运算符判断是否为数组 是：定义数组 否：定义对象
                    deepAlone(Origin[prop],Target[prop]);                           //递归
               }
               else{
                   Target[prop] = Origin[prop];                                     //递归终止条件
               }
         }
    }
    return Targin;                                                                  //返回克隆好的对象。
}
var obj1 = deepAlone(obj);

        

JavaScript语言我个人感觉是最有意思的了，我也是一个初学者，遇到问题，喜欢在博客上分享，

也希望能帮到大家。 一个初学者，有什么不足或者纰漏的话，希望在下面评论出来，相互学习，共同进步。

         --主页传送门--