JS 變數拷貝

一、資料型別

資料型別分類

基本資料型別：string,boolean,number,symbol（es6新增）,undefined, null

引用資料型別：object

基本資料型別中有兩個為特殊資料型別： null, undefined

js的常見內建物件：date,array,math,number,boolean,string,array,regexp,function…

其中基本資料型別在記憶體中是直接儲存資料的，所以物件複製就相當於直接新物件開闢乙個新的記憶體空間，然後為新的記憶體空間賦值，新舊兩個變數是不同記憶體空間，同乙個值。

對於基本資料型別，淺複製和深複製沒有區別。

二、淺拷貝

淺拷貝只遍歷一層，如果存在陣列成員是物件，不會對物件裡的值進行遍歷拷貝。

如果資料型別是object，他在資料空間中真正儲存的乙個位址，資料都是儲存在另外乙個地方，通過儲存的那個位址可以訪問，所以物件的簡單拷貝就只是僅僅在新開闢的資料空間中複製了那個位址，所以如果對原來物件裡面的數進行改變，新的物件也會受到影響。

三、深複製

淺複製就只是將物件的儲存位址複製一次，深複製，就是開闢一片新的資料空間儲存資料，新的物件儲存的位址是新開闢空間的引用位址，與原來物件儲存的位址完全不一樣。

四、深複製的方法

es6 的擴充套件運算子(…)

object.assign()

.concat()

array.slice(0)

json.parse(json.stringify(obj))

var a8 =[1
,2,3
,[4,
5]];
var b8 = a8;
var c8 =
[...a8]
;var d8 = object.
assign([
], a8)
;var e8 =
.concat
(a8)
;var f8 = a8.
slice(0
);var deep =
json
.parse
(json
.stringify
(a8));
console.
log(a8,b8,c8,d8,e8, f8, deep)
;// a8-deep: [1,2,3,[4,5]]
a8[0]=
0;a8[3][
0]=6
;console.
log(a8,b8,c8,d8,e8,f8,deep);/*
[ 0, 2, 3, [ 6, 5 ] ]
[ 0, 2, 3, [ 6, 5 ] ]
[ 1, 2, 3, [ 6, 5 ] ]
[ 1, 2, 3, [ 6, 5 ] ]
[ 1, 2, 3, [ 6, 5 ] ]
[ 1, 2, 3, [ 6, 5 ] ]
[ 1, 2, 3, [ 4, 5 ] ]
*/

由上可看出:擴充套件運算子與 object.assign() 方法，雖然能開闢乙個新的空間來儲存資料的值，但是如果物件裡面有物件的引用，也僅僅是淺複製，沒有進行深複製，唯有json.parse(json.stringify(obj)) 無論物件結構裡面引用了多少層的物件引用，複製之後都不會收到影響。

所以變數是簡單的資料物件，用擴充套件運算子與 object.assign() 方法就好，如果是複雜的資料結構，建議使用json.parse(json.stringify(obj))，但是這種方法拷貝後的陣列會丟失原陣列中定義的方法和陣列原型中定義的方法。因為函式方法不符合json解析，所以不會被轉成json字串，他們會被過濾掉。

var target =
}target // 
json
.parse
(json
.stringify
(target)
)target //

五、變數在記憶體中的儲存位置

基本型別物件

棧區（stack）

堆區（heap）

六、總結

物件賦值，賦的是該物件在棧中的位址，而不是堆中的資料。也就是乙個物件的改變就會改變另外乙個物件。

物件淺拷貝會建立乙個物件，再去遍歷原始物件，如果原物件的屬性值是基礎型別，那麼就拷貝基礎型別，如果是引用型別，則拷貝的是指標。

如果物件屬性值都是基礎型別，那麼淺複製即可，如果包含引用型別，那麼就應該用深複製

JS 變數拷貝

JS 變數及深淺拷貝

js淺拷貝深拷貝

淺拷貝，深拷貝 js

JS 變數拷貝

JS 變數及深淺拷貝

js淺拷貝深拷貝

淺拷貝，深拷貝 js

相關推薦