JavaScript的深拷貝與淺拷貝

這個問題出在“物件”的賦值上: 在JavaScript中，物件是按引用(不知道什麼是引用的請自行百度)傳值的，這就引出了今天我們要討論的話題：深拷貝、淺拷貝：

淺拷貝現象:

var obj1 = {"a":"11", "aa":{"b":"22"}};
var obj2 = obj1;
console.log(obj1 === obj2);  //不明白 == 與 === 的區別的也請自行百度

>>> true

上面這個問題說明——obj1和obj2就是一個物件而非內容相同的兩個物件，這就導致了，若是修改了obj2的值，obj1的值也會跟著改變：

obj2.a = "33";
console.log(obj2.a, ":", obj1.a);

>>> 33 : 33

與淺拷貝相對的就是深拷貝，這個就比較好理解了，他們是內容相同的兩個不同的物件；實現深拷貝的方法：

方案一：使用ES6語法中的 Object.assign() 方法
方法缺點：只能實現一層的深拷貝，對於子物件還是淺拷貝（當然，你要是願意用迴圈遞迴什麼的來實現整體的深拷貝的話我也不好說啥）。

var obj1 = {"a":"11", "aa":{"b":"22"}};
var obj2 = Object.assign({}, obj1);
console.log(obj1===obj2, ":", obj1.aa===obj2.aa);

>>> false ":" true
 

方案二：先轉成字串再轉回來
方法特點：實現簡單，原理易懂。但是，只適用於JSON物件，對function來說就不好使了。不過，也能滿足一般的需求了。

var obj1 = {"a":"11", "aa":{"b":"22"}};
var obj2 = JSON.parse(JSON.stringify(obj1));
console.log(obj1===obj2, ":", obj1.aa===obj2.aa);

>>> false ":" false

其他的方法我就不會了，有更高需求的大佬們請Google

– END    TIME:2018/12/11 19:42 –