JavaScript深拷貝實現原理簡析
阿新 • • 發佈:2018-07-28
不出 附加 als 實現 code == 除了 目標 ring
Why: 引用類型拷貝為了不出現數據共享問題,需要使用深拷貝。
So:
1.內部原理:
1 function inCopy(obj1,obj2) { 2 var obj1 = obj1 || {};//容錯處理 3 for (var k in obj2) { 4 if(obj2.hasOwnProperty(k)){ //只拷貝實例屬性,不進行原型的拷貝 5 if(typeof obj2[k] == ‘object‘) { //引用類型的數據單獨處理 6 obj1[k] = Array.isArray(obj2[k])?[]:{};7 inCopy(obj1[k],obj2[k]); //遞歸處理引用類型數據 8 }else{ 9 obj1[k] = obj2[k]; //值類型的數據直接進行拷貝 10 } 11 } 12 } 13 }
2. 除了遞歸,我們還可以借用JSON對象的parse和stringify:
function deepClone(obj){ let _obj = JSON.stringify(obj), objClone = JSON.parse(_obj);return objClone } let a=[0,1,[2,3],4], b=deepClone(a); a[0]=1; a[2][0]=1; console.log(a,b);
3.除了上面兩種方法之外,我們還可以借用JQ的extend方法。
$.extend( [deep ], target, object1 [, objectN ] )
deep表示是否深拷貝,為true為深拷貝,為false,則為淺拷貝
target Object類型 目標對象,其他對象的成員屬性將被附加到該對象上。
object1 objectN可選。 Object類型 第一個以及第N個被合並的對象。
let a=[0,1,[2,3],4], b=$.extend(true,[],a); a[0]=1; a[2][0]=1; console.log(a,b);
可以看到,效果與上面方法一樣,只是需要依賴JQ庫。
JavaScript深拷貝實現原理簡析