JavaScript的深克隆和淺克隆

最近在複習，發現前端好多知識點牽一髮動全身。

比如我想看一下JQuery的extend源碼，就不得不再好好看看深克隆淺克隆的問題。

什麼是深克隆？

我們都知道，JavaScript有六種基本的數據類型。

五種基本的數據類型：string，number，undefined，boolean，null

（在內存中表現為一個值，保存在棧中）

一種複雜的數據類型（引用類型）：object 【function，array，object】

（在內存中表現為一個指針，保存在堆中）

將一個對象的所有屬性均複製，並將該對象與原對象放在內存中不同的位置，此時，改變新對象的屬性不會對原對象造成影響，這種行為叫做深克隆。

我們還是先看淺克隆吧。。。

 var people= { name:"sun", age:24, hobby:["eat","shopping"], son:{ age:3

看他們的愛好！！.png

淺克隆只是簡單的複製對象，若對象其中一個屬性是引用值，由於引用型變量保存的是內存的一個地址，所以後來的

hobby

從上面的例子也可以看出，

name

解決克隆引用值問題，還是需要深度克隆的！

for-in循環遍歷對象上的所有屬性，判斷是否為引用值，若是，進行遞歸，直到所有屬性都為原始值為止。

拷貝出來後，就是一個全新對像，就和之前沒什麼關係了，以前的改變也不能對新的產生影響！！

var people= { name:"sun", age:24, hobby:["eat","shopping"], son:{ age:3

看他們的愛好！！.png

一些擴展

• js裡的concat函數

  concat函數對數組進行了深度克隆

  var a = [1,2,3];

• jQuery.extend( [deep ], target, object1 [, objectN ] )

  deep

  類型: Boolean

  如果是true，合併成為遞歸（又叫做深拷貝）默認值為false，表示淺拷貝。

  target

  類型: Object

  對象擴展。這將接收新的屬性。

  object1

  類型: Object

  一個對象，它包含額外的屬性合併到第一個參數.

  objectN

  類型: Object

  包含額外的屬性合併到第一個參數

  1.合併兩個對象，並修改第一個對象

  var a= { name:"sun", age:24, hobby:["eat","shopping"], son:{ age:3

b覆蓋了a的原有屬性.png

2.當繼承的對象屬性中有引用類型的時候，兩個對象同時指向一個對象，改變一個另一個也隨之改變。如果有相同屬性，後邊的會覆蓋前邊的

var a= { name:"sun", age:24, son:{ age:3, name:"小名"