摘要:淺拷貝與深拷貝一數據類型數據分為基本數據類型,和對象數據類型。淺拷貝是按位拷貝對象,它會創建一個新對象,這個對象有著原始對象屬性值的一份精確拷貝。對于字符串數字及布爾值來說不是或者對象,會拷貝這些值到新的數組里。
淺拷貝與深拷貝
一、數據類型
數據分為基本數據類型(String, Number, Boolean, Null, Undefined,Symbol)和對象數據類型。
基本數據類型的特點:直接存儲在棧(stack)中的數據
引用數據類型的特點:存儲的是該對象在棧中引用,真實的數據存放在堆內存里
引用數據類型在棧中存儲了指針,該指針指向堆中該實體的起始地址。當解釋器尋找引用值時,會首先檢索其在棧中的地址,取得地址后從堆中獲得實體。
??
二、淺拷貝與深拷貝
深拷貝和淺拷貝是只針對Object和Array這樣的引用數據類型的。
深拷貝和淺拷貝的示意圖大致如下:
??
淺拷貝只復制指向某個對象的指針,而不復制對象本身,新舊對象還是共享同一塊內存。但深拷貝會另外創造一個一模一樣的對象,新對象跟原對象不共享內存,修改新對象不會改到原對象。
三、賦值和淺拷貝的區別
當我們把一個對象賦值給一個新的變量時,賦的其實是該對象的在棧中的地址,而不是堆中的數據。也就是兩個對象指向的是同一個存儲空間,無論哪個對象發生改變,其實都是改變的存儲空間的內容,因此,兩個對象是聯動的。
淺拷貝是按位拷貝對象,它會創建一個新對象,這個對象有著原始對象屬性值的一份精確拷貝。如果屬性是基本類型,拷貝的就是基本類型的值;如果屬性是內存地址(引用類型),拷貝的就是內存地址 ,因此如果其中一個對象改變了這個地址,就會影響到另一個對象。即默認拷貝構造函數只是對對象進行淺拷貝復制(逐個成員依次拷貝),即只復制對象空間而不復制資源。
我們先來看兩個例子,對比賦值與淺拷貝會對原對象帶來哪些改變?
??
??
??
??
上面例子中,obj1是原始數據,obj2是賦值操作得到,而obj3淺拷貝得到。我們可以很清晰看到對原始數據的影響,具體請看下表:
??
四、淺拷貝的實現方式
1.Object.assign()
Object.assign() 方法可以把任意多個的源對象自身的可枚舉屬性拷貝給目標對象,然后返回目標對象。但是 Object.assign()進行的是淺拷貝,拷貝的是對象的屬性的引用,而不是對象本身。
?
注意:當object只有一層的時候,是深拷貝
??
2.Array.prototype.concat()
??
修改新對象會改到原對象:
??
3.Array.prototype.slice()
?
同樣修改新對象會改到原對象:
??
關于Array的slice和concat方法的補充說明:Array的slice和concat方法不修改原數組,只會返回一個淺復制了原數組中的元素的一個新數組。
原數組的元素會按照下述規則拷貝:
如果該元素是個對象引用(不是實際的對象),slice 會拷貝這個對象引用到新的數組里。兩個對象引用都引用了同一個對象。如果被引用的對象發生改變,則新的和原來的數組中的這個元素也會發生改變。
對于字符串、數字及布爾值來說(不是 String、Number 或者 Boolean 對象),slice 會拷貝這些值到新的數組里。在別的數組里修改這些字符串或數字或是布爾值,將不會影響另一個數組。
可能這段話晦澀難懂,我們舉個例子,將上面的例子小作修改:??
??
五、深拷貝的實現方式
JSON.parse(JSON.stringify())
??
??
原理: 用JSON.stringify將對象轉成JSON字符串,再用JSON.parse()把字符串解析成對象,一去一來,新的對象產生了,而且對象會開辟新的棧,實現深拷貝。
這種方法雖然可以實現數組或對象深拷貝,但不能處理函數
??
??
這是因為JSON.stringify() 方法是將一個JavaScript值(對象或者數組)轉換為一個 JSON字符串,不能接受函數
手寫遞歸方法
遞歸方法實現深度克隆原理:遍歷對象、數組直到里邊都是基本數據類型,然后再去復制,就是深度拷貝
??
函數庫lodash
該函數庫也有提供_.cloneDeep用來做 Deep Copy
??
喜歡的可以關注小編~
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/54879.html
摘要:所以,深拷貝是對對象以及對象的所有子對象進行拷貝實現方式就是遞歸調用淺拷貝對于深拷貝的對象,改變源對象不會對得到的對象有影響。 為什么會有淺拷貝與深拷貝什么是淺拷貝與深拷貝如何實現淺拷貝與深拷貝好了,問題出來了,那么下面就讓我們帶著這幾個問題去探究一下吧! 如果文章中有出現紕漏、錯誤之處,還請看到的小伙伴多多指教,先行謝過 以下↓ 數據類型在開始了解 淺拷貝 與 深拷貝 之前,讓我們先...
摘要:所以,深拷貝是對對象以及對象的所有子對象進行拷貝實現方式就是遞歸調用淺拷貝對于深拷貝的對象,改變源對象不會對得到的對象有影響。 上一篇 JavaScript中的繼承 前言 文章開始之前,讓我們先思考一下這幾個問題: 為什么會有淺拷貝與深拷貝 什么是淺拷貝與深拷貝 如何實現淺拷貝與深拷貝 好了,問題出來了,那么下面就讓我們帶著這幾個問題去探究一下吧! 如果文章中有出現紕漏、錯誤之處...
摘要:深拷貝與淺拷貝的出現,就與這兩個數據類型有關。這時,就需要用淺拷貝來實現了。數據一但過多,就會有遞歸爆棧的風險。這個方法是在解決遞歸爆棧問題的基礎上,加以改進解決循環引用的問題。但如果你并不想保持引用,那就改用用于解決遞歸爆棧即可。 前言 這是前端面試題系列的第 9 篇,你可能錯過了前面的篇章,可以在這里找到: 數組去重(10 種濃縮版) JavaScript 中的事件機制(從原生到...
摘要:也就是說,深拷貝與淺拷貝最主要的區別在引用類型的拷貝上。方法二遞歸拷貝深拷貝與淺拷貝相比不就是多拷貝幾層的事嘛,這不就是遞歸常干的事嘛。 什么是淺拷貝和深拷貝 淺拷貝 淺拷貝:將一個對象自身的屬性拷貝給另一個對象,如果源對象的屬性是基本類型則直接進行值賦值,如果是引用類型則進行引用賦值,也就是說只進行一層賦值。 深拷貝 深拷貝:將一個對象自身的屬性拷貝給另一個對象,如果源對象的屬性是基...
閱讀 2779·2023-04-26 01:47
閱讀 3591·2023-04-25 23:45
閱讀 2461·2021-10-13 09:39
閱讀 606·2021-10-09 09:44
閱讀 1789·2021-09-22 15:59
閱讀 2761·2021-09-13 10:33
閱讀 1706·2021-09-03 10:30
閱讀 656·2019-08-30 15:53