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