js中深拷貝陣列,物件,物件陣列方法

2021-08-21 02:51:26 字數 1727 閱讀 8850

首先看看這邊講的

在js中,對於字串,布林值可直接使用賦值運算子就可以實現深拷貝,但對於引用型別,陣列,物件,物件陣列的拷貝呢,實際只是進行了淺拷貝

下面是乙個陣列

var arr = ["a","b"];
現在怎麼進行arr陣列的拷貝呢,直接賦值來的結果

var arrcopy = arr;

arrcopy[1]="c";

arr // ["a","c"]

可以看出拷貝陣列arrcopy進行操作時原陣列也相應被改變了,這就是js的淺拷貝。所以對引用型別進行簡單的賦值運算,只是建立了乙份原內容的引用,指向的仍然是同一塊記憶體區域,修改時會改變原來內容,而我們有時候不需要這樣的模式,那怎麼樣進行深拷貝呢

1.陣列的深拷貝

方法1  遍歷複製

var arr = ["a","b"];

var arrcopy=;

for(var item in arr)

arrcopy[1]="c";

arr // => ["a","b"]

arrcopy // ["a","c"]

2.物件的深拷貝

var obj = ;
同樣進行賦值運算子操作

var objcopy = obj;

objcopy = 3;

obj //

objcopy //

同樣,簡單的賦值運算只是乙份淺拷貝。

對於物件的深拷貝,沒有內建方法可以使用,我們可以自己命名乙個函式進行這項操作:

var objdeepcopy = function(source);

for(var item in source)

return sourcecopy;

}

但是對於複雜結構的物件,這個函式並不適用,例如:

var obj = ,

"b":2}

還需要修改一下:

var objdeepcopy = function(source);

for(var item in source)

return sourcecopy;

}var objcopy = objdeepcopy(obj);

objcopy.a.a1[1]="a13";

obj // , "b": 2 }

objcopy // , "b": 2 }

3.物件陣列的深拷貝

var obj = [

, "b": 2 },

["c", ]

];

var objdeepcopy = function (source) ;

for (var item in source)

return sourcecopy;

}var objcopy = objdeepcopy(obj);

objcopy[0].a.a1[1] = "a13";

objcopy[1][1].e = "6";

obj // => [, "b": 2 }, ["c", ]]

objcopy // => [, "b": 2 }, ["c", ]]

JS中深拷貝陣列 物件 物件陣列方法

我們在js程式中需要進行頻繁的變數賦值運算,對於字串 布林值等可直接使用賦值運算子 即可,但是對於陣列 物件 物件陣列的拷貝,我們需要理解更多的內容。首先,我們需要了解js的淺拷貝與深拷貝的區別。我們先給出乙個陣列 var arr a b 現在怎麼建立乙份arr陣列的拷貝呢?直接執行賦值運算嗎?我們...

JS中深拷貝陣列 物件 物件陣列方法

我們在js程式中需要進行頻繁的變數賦值運算,對於字串 布林值等可直接使用賦值運算子 即可,但是對於陣列 物件 物件陣列的拷貝,我們需要理解更多的內容。首先,我們需要了解js的淺拷貝與深拷貝的區別。我們先給出乙個陣列 var arr a b 現在怎麼建立乙份arr陣列的拷貝呢?直接執行賦值運算嗎?我們...

JS深拷貝陣列和物件

有時候在些js 時不小心直接給陣列和物件直接賦值,可能不會直接產生什麼 但若是遇到了奇怪的問題了,這很有可能就是在拷貝陣列或者物件時時進行淺拷貝,接受者在不知不覺地改變了某些元素的值,從而導致原始值就莫名其妙地被同步修改了 面對這種情況,最好對陣列或者物件進行深拷貝,為了不影響某些元素的丟失 比如某...