克隆,针对的对象是对象,数组,函数等这些复杂的数据
浅克隆就是将栈内存中的引用复制一份,赋给一个新的变量,本质上两个指向堆内存中的同一地址,内容也相同,其中一个变化另一个内容也会变化(根本上改变的是同一个对象)。
深克隆就是创建一个新的空对象,开辟一块内存,然后将原对象中的数据全部复制过去,完全切断两个对象间的联系。
浅克隆:
1 var obj={ 2 age:11, 3 name:'xiaoming', 4 fn:function(){ 5 console.log(this.age); 6 }, 7 arr:[1,2,3,4] 8 } 9 function clone(origin,target){ 10 var target=target||{}; 11 for(var key in origin){ 12 target[key]=origin[key] 13 } 14 } 15 var obj2={}; 16 clone(obj,obj2);//浅克隆 17 console.log(obj2); 18 obj2.arr[0]=2; 19 console.log(obj.arr);//[2,2,3,4] 20 console.log(obj2.arr);//[2,2,3,4] 21 obj.age=2; 22 console.log(obj.age);//2 23 console.log(obj2.age);//11
可以明显的发现浅克隆中,当改变一个对象的原始值属性时,另一个的属性并不会发生改变,而当改变引用值属性的,由于该值指向同一个地址,因此会同时改变,这时候如果想完全切断他们的联系,我们就必须用到深克隆,也就是对于他的引用值属性进行特殊处理。
深克隆:
1 var obj={ 2 age:11, 3 name:'xiaoming', 4 fn:function(){ 5 console.log(this.age); 6 }, 7 arr:[1,2,3,4] 8 } 9 function clone(origin,target){ 10 var target=target||{}; 11 for(var key in origin){ 12 target[key]=origin[key] 13 } 14 } 15 function deepclone(origin,target){ 16 var target=target||{}; 17 var str=Object.prototype.toString; 18 for(var key in origin){ 19 if(origin.hasOwnProperty(key)){ 20 if(typeof origin[key] === 'object' && origin[key] !==null){ 21 if(str.call(origin[key])==='[object Object]'){ 22 // 对象值 23 target[key]={}; 24 }else{ 25 // 数组 26 target[key]=[]; 27 } 28 deepclone(origin[key],target[key]) 29 }else{ 30 target[key]=origin[key]; 31 } 32 33 } 34 } 35 } 36 var obj2={}; 37 deepclone(obj,obj2); 38 obj2.arr[0]=2; 39 console.log(obj.arr);//[1,2,3,4] 40 console.log(obj2.arr);//[2,2,3,4]