JavaScript物件的深複製

js的資料型別可以分為兩大類：

• #值型別（原始型別）：
  例如String、Number型別都是值型別。

• 引用類型：
  例如Object、Array是參考類型。

簡單說一下他們兩者的差異：
最明顯的差異就是賦值。值類型的賦值是真正的copy一份賦給新的變數的：

var a, b = "issax";
a = b;
a +="_coder";
console.log(a);  //issax_coder
console.log(b);  //issax

看上面的例子，將b賦值給a之後，a、 b兩個變數就是互相獨立的，改變自身的值不會影響到對方，這就是值類型。

然後看看引用類型：

var obj_i, obj_ii = { name: 'issax' };
obj_i = obj_ii;
obj_i['career'] = 'coder';
console.log(obj_i);  //Object {name: "issax", career: "coder"}
console.log(obj_ii);  //Object {name: "issax", career: "coder"}

看到沒有，將obj_ii的值賦給obj_i後，改變obj_i的內容，會連同obi_ii的內容也改變，這就是引用類型。引用類型的變數儲存並不是內容本身，而是指向內容的一個指針，沒錯，你賦值的時候其實只是將這個指針賦值給了新變量，他們都指向同一個內容，為什麼出現上面的情況就不言而喻了。

握草，我在說什麼gui，我是來說物件的深複製的啊[摀臉]

複製又可以分為淺複製和深複製，看完上面例子，大概聯想一下就知道什麼是淺複製什麼是什麼深複製了，
平常的值類型的賦值過程就是深複製，而引用類型的賦值就是淺複製。

既然物件是引用型，那麼它平常的賦值過程就是淺複製了，但是啊，有時候物件也是需要深交的，握草，我說了什麼gui，是深複製。

例如，前兩天在做Vue，遇到一個需求，要按name來排序，奇數次click就排序，偶數次click就恢復原來的按更新時間排序。這Tm還不簡單，每次都sort一下不就好了。真Tm這樣做就sb了，尼瑪你想一下，除了第一次排序是有意義的，第二三四五六七八……有什麼意義，他們都是重複的，每次sort一下不是很浪費性能嗎！那就該將sort後的物件儲存起來…
然後就gg了，物件是引用類型，一開始我直接賦值了，然後場面一度十分尷尬，資料根本不動[摀臉]；

要想屬性一個一個的遞迴複製嗎？然後我的物件是類似這樣的：

Paste_Image.png

握草，真遞歸複製就sb啦，好在想到個好辦法，值型別是深複製的，這Tm將引用型別轉換成值型別不就o了嗎[狂喜]
小二，上碼：

function deepCopy(sender){
  var temp = JSON.stringify(sender);
  return JSON.parse(temp);
}  
var obj_i, obj_ii = { name: 'issax' };
obj_i = deepCopy(obj_ii);
obj_i['career'] = 'coder';
console.log(obj_i);  //Object {name: "issax", career: "coder"}
console.log(obj_ii);  //Object {name: "issax"}

Paste_Image.png

#

以上是JavaScript物件的深複製的詳細內容。更多資訊請關注PHP中文網其他相關文章！