天天看點

JavaScript之深拷貝,淺拷貝

JavaScript之深拷貝,淺拷貝

概念

簡單來了解就是假設B複制了A,當修改A時,看B是否會發生變化,如果B也跟着變了,說明這是淺拷貝,如果B沒變,那就是深拷貝。

深入了解淺拷貝

首先,舉個例子,代碼如下:

var a=[0,1,2,3,4,5],
b=a;
console.log(a===b);
a[0]=1;
console.log(a,b);
           
JavaScript之深拷貝,淺拷貝

根據這個例子可以看出b複制了a的内容,b随着a的變化而變化,這就是淺拷貝。

深入了解深拷貝

通過堆棧存儲更好了解深拷貝

首先建立一個數組a,配置設定的棧記憶體如下:

JavaScript之深拷貝,淺拷貝

b對a進行複制,棧記憶體會新開辟一個記憶體:

JavaScript之深拷貝,淺拷貝

當修改a的某個值時,對b并不會造成影響,雖然b不受a影響,但這也算不上深拷貝,因為深拷貝本身隻針對較為複雜的object類型資料。

引用資料類型–名存在棧記憶體中,值存在于堆記憶體中,但是棧記憶體會提供一個引用的位址指向堆記憶體中的值

JavaScript之深拷貝,淺拷貝

當b對a進行拷貝時,其實複制的是a的引用位址,并非不是堆裡面的值。

JavaScript之深拷貝,淺拷貝

當a數組進行修改時,由于a與b指向的是同一個位址,是以b也受了影響,這就是所謂的淺拷貝。

JavaScript之深拷貝,淺拷貝

而要到達深拷貝,就要讓b重新開辟一個堆記憶體

JavaScript之深拷貝,淺拷貝

這就實作了深拷貝

繼續閱讀