JS基本和引用數據深拷貝及淺拷貝的區別

本篇內容主要講解“JS基本和引用數據深拷貝及淺拷貝的區別”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“JS基本和引用數據深拷貝及淺拷貝的區別”吧!

淺拷貝

　　在定義一個對象或數組時，變量存放的往往只是一個地址。當我們使用對象拷貝時，如果屬性是對象或數組時，這時候我們傳遞的也只是一個地址。因此子對象在訪問該屬性時，會根據地址回溯到父對象指向的堆內存中，即父子對象發生了關聯，兩者的屬性值會指向同一內存空間。

　　但是若是修改的屬性變為對象或數組時，那么父子對象之間就發生關聯

　　原因是key1的值屬于基本類型，所以拷貝的時候傳遞的就是該數據段；但是key2的值是堆內存中的對象，所以key2在拷貝的時候傳遞的是指向key2對象的地址，無論復制多少個key2，其值始終是指向父對象的key2對象的內存空間。

深拷貝

　　或許以上并不是我們在實際編碼中想要的結果，我們不希望父子對象之間產生關聯，那么這時候可以用到深拷貝。既然屬性值類型是數組和或象時只會傳址，那么我們就用遞歸來解決這個問題，把父對象中所有屬于對象的屬性類型都遍歷賦給子對象即可。

　　最后：總結基本數據類型和引用數據類型區別

聲明變量時內存分配不同

　　*原始類型：在棧中，因為占據空間是固定的，可以將他們存在較小的內存中-棧中，這樣便于迅速查詢變量的值

　　*引用類型：存在堆中，棧中存儲的變量，只是用來查找堆中的引用地址。

　　這是因為：引用值的大小會改變，所以不能把它放在棧中，否則會降低變量查尋的速度。相反，放在變量的棧空間中的值是該對象存儲在堆中的地址。地址的大小是固定的，所以把它存儲在棧中對變量性能無任何負面影響

不同的內存分配帶來不同的訪問機制

　　在javascript中是不允許直接訪問保存在堆內存中的對象的，所以在訪問一個對象時，首先得到的是這個對象在堆內存中的地址，然后再按照這個地址去獲得這個對象中的值，這就是傳說中的按引用訪問。

　　而原始類型的值則是可以直接訪問到的。

復制變量時的不同

　　1）原始值：在將一個保存著原始值的變量復制給另一個變量時，會將原始值的副本賦值給新變量，此后這兩個變量是完全獨立的，他們只是擁有相同的value而已。

　　2）引用值：在將一個保存著對象內存地址的變量復制給另一個變量時，會把這個內存地址賦值給新變量，

　　也就是說這兩個變量都指向了堆內存中的同一個對象，他們中任何一個作出的改變都會反映在另一個身上。

參數傳遞的不同

　　首先我們應該明確一點：ECMAScript中所有函數的參數都是按值來傳遞的。

　　但是為什么涉及到原始類型與引用類型的值時仍然有區別呢？還不就是因為內存分配時的差別。

　　1）原始值：只是把變量里的值傳遞給參數，之后參數和這個變量互不影響。

　　2）引用值：對象變量它里面的值是這個對象在堆內存中的內存地址，這一點你要時刻銘記在心！

　　因此它傳遞的值也就是這個內存地址，這也就是為什么函數內部對這個參數的修改會體現在外部的原因了，因為它們都指向同一個對象。

到此，相信大家對“JS基本和引用數據深拷貝及淺拷貝的區別”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！