詳談Javascript中的深複製和淺複製

大雄45發表於2021-08-19
導讀 資料複製是我們程式設計中經常會使用到的技術,對於普通數值資料來說,複製很簡單,但是對於複雜型別比如物件的複製,就會有很多需要考慮的東西,比如我們經常說到的深複製和淺複製。

詳談Javascript中的深複製和淺複製詳談Javascript中的深複製和淺複製

淺複製

複製的物件和原始物件屬性相關聯。事實上,如果物件的任何欄位被其他物件引用,則它們共享相同的記憶體地址。

深複製

與淺複製不同,深複製複製物件的所有屬性,並且為新物件分配新的記憶體地址,我們對新物件的操作不會影響到原物件,看起來就像是將原物件所有的東西都重新複製出來一份。

詳談Javascript中的深複製和淺複製詳談Javascript中的深複製和淺複製

資料型別

JavaScript中的資料型別分為原始資料型別和複合資料型別。

詳談Javascript中的深複製和淺複製詳談Javascript中的深複製和淺複製

數值,字串,布林值,undefined,null為原始資料型別,而陣列和物件則是複合型別。

原始資料進行復制克隆的時候,永遠都是新的副本,不會和原來資料進行關聯,而複合資料進行淺複製的時候,只是分配值的引用。

建立深複製

對於克隆物件,如果我們想要進行深複製,那麼我們經常使用的方法就是JSON.parse()和JSON.stringify()。

陣列Map,ForEach和Slice

對於普通的一維陣列,函式Map,ForEach,Slice都提供深複製的功能,但是對於巢狀陣列,這些函式對於內部陣列的處理不提供深複製的功能。

總結

Object.assign和Object.create都可以進行物件的複製。

使用assign方法時,我們必須確保物件至少複製第二個引數。通常你只會傳遞一個空物件作為第一個引數。它不提供類似於擴充套件運算子的完整複製。

使用create方法時,現有物件作為新建立物件的原型建立一個新物件。現有物件作為原型可用,從而使所有屬性都可用於新物件。但就複製而言,它提供了部分深複製,如分配和擴充套件運算子。

在 JavaScript 中複製物件的唯一陷阱是巢狀值。

原文來自:

來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69955379/viewspace-2784525/,如需轉載,請註明出處,否則將追究法律責任。

相關文章