一. 合並與克隆的差別
1. 克隆是特殊的合並(以空對象作為目標對象,非空對象作為源對象進行合並),克隆要求目標對象與源對象的 constructor相同。
2. 克隆的源對象只有一個,合並的源對象可以是多個。
二. 合並的方法
1.Object.assign():
例:var obj1 ={
m : 1,
n : 2,
j : {
r : {
h : 2
},
p : 4 } ,
p : 1
}
var obj2 ={ m : 2 , n : undefined, j : { h : 2 ,o: 3}}
var obj3 = Object.assign(obj1,obj2);
結果:obj1 = { m : 2,n : undefined, j : { h : 2, o : 3 }, p : 1 };
obj2 ={ m : 2 , n : undefined, j : { h : 2, o : 3 } };
obj3 ={ m : 2 , n : undefined, j : { h : 2, o : 3 }, p : 1 };
注意:1). 目標對象自身也會變 obj1===obj3
2). 此方法為淺合並
3). undefined參與合並
4). 原型不屬性參與合並
2. $.extend:
情況一:
例:var obj1 ={ m : 1, n : 2, j : { r : { h : 2 }, p : 4 }, p : 1 }
var obj2 ={ m : 2, n : undefined, j : { h : 2, o : 3 } }
var obj3 = $.extend(obj1,obj2);
結果:obj1 = { m : 2, n : 2, j : { h : 2, o : 3 }, p : 1 };
obj2 ={ m : 2, n : undefined, j : { h : 2, o : 3 } };
obj3 ={ m : 2, n : 2, j : { h : 2, o : 3 }, p : 1 };
注意:1). 目標對象自身也會變 obj1===obj3
2). 此方法為淺合並
3). undefined不參與合並
4). 原型不屬性參與合並
情況二:
例:var obj1 ={ m : 1, n : 2, j : { r : { h : 2 }, p : 4 }, p : 1 }
var obj2 ={ m : 2, n : undefined, j : { h : 2, o : 3 } }
var obj4 = $.extend({},obj1,obj2);
結果:obj1 = { m : 1, n : 2, j : { r : { h : 2 }, p : 4 }, p : 1 };
obj2 ={ m : 2, n : undefined, j : { h : 2, o : 3 } };
obj3 ={ m : 2, n : 2, j : { h : 2, o : 3 }, p : 1 };
注意:1). 此方法為淺合並
2). undefined不參與合並
3). 原型不屬性參與合並
情況三:
例:var obj1 ={ m:1,n:2,j:{r:{h:2},p:4},p:1}
var obj2 ={m:2,n:undefined,j:{h:2,o:3}}
var obj3 = $.extend(true,obj1,obj2);
結果:obj1 = {m:2,n:2,j:{h:2,o:3,r:{h:2},p:4},p:1};
obj2 ={m:2,n:undefined,j:{h:2,o:3}};
obj3 ={m:2,n:2,j:{h:2,o:3,r:{h:2},p:4},p:1};
注意:1). 目標對象自身也會變 obj1===obj3
2). 此方法為深合並
3). undefined不參與合並
4). 原型不屬性參與合並
3. 遍歷賦值法
思路:將obj2中存在的屬性但obj1不存在的屬性賦值給obj1。
步驟:1). 遍歷obj2中屬性。
2). 判斷obj1不存在此屬性
3). 將次值賦給obj1
var extentObj = function(obj1,obj2){
for(let key in obj2){
if(obj2.hasOwnProperty(key) && (!obj1.hasOwnProperty(key))){
obj1[key] = obj2[key]
}
}
}
三. 克隆的方法
1. JSON.parse(JSON.stringify()):
1). 先將對象變為字符串,然后再變為json對象,防止對象的指針指向問題,為深拷貝
2). undefined 和 function 類型的屬性會被忽略,而 Date 類型的屬性則會被轉換為字符串
2. $.extend:
傳true為深拷貝,不傳為淺拷貝
注意:深拷貝與淺拷貝的區別
淺拷貝直接把引用地址原樣拿來,此時,不管源對象還是目標對象,修改引用屬性后另一個對象的同名屬性都會受到影響。
深拷貝則會遞歸地在目標對象上創建值,目標對象和源對象之間將完全獨立