JavaScript數組深拷貝和淺拷貝的兩種方法_javascript技巧

例如這個範例：

複製程式碼 程式碼如下:

var arr = ["One", "Two","Three"];

var arrto = arr;
arrto[1] = "test";
document.writeln("陣列的原始值：" arr "
");//Export:陣列的原始值：One,test,Three
document.writeln("陣列的新值：" arrto "
");//Export:陣列的新值：One,test,Three

像上面的這種直接賦值的方式就是淺拷貝，很多時候，這樣並不是我們想要得到的結果，其實我們想要的是arr的值不變，不是嗎？

方法一：js的slice函數

複製程式碼 程式碼如下:

程式碼如下:


對於🎜>對於物件的slice函數，
傳回一個陣列的一段。 （仍為陣列）
arrayObj.slice(start, [end]) 
參數
arrayObj 
必選項。一個 Array 物件。 
start 
必選項。 arrayObj 中所指定的部分的開始元素是從零開始計算的下標。 
end 
可選項。 arrayObj 中所指定的部分的結束元素是從零開始計算的下標。 

說明
slice 方法傳回一個 Array 對象，其中包含了 arrayObj 的指定部分。
slice 方法一直複製到 end 所指定的元素，但不包含該元素。如果 start 為負，將它當作 length start處理，此處 length 為陣列的長度。如果 end 為負，就將它當作 length end 處理，此處 length 為陣列的長度。如果省略 end ，那麼 slice 方法將會一直複製到 arrayObj 的結尾。如果 end 出現在 start 之前，不複製任何元素到新數組中。

範例：

複製程式碼

代碼如下:



代碼如下:

代碼如下: arr = ["One","Two","Three"];

var arrtoo = arr.slice(0);arrtoo[1] = "set Map";document. writeln("陣列的原始值：" arr "
");//Export:陣列的原始值：One,Two,Threedocument.writeln("陣列的新值：" arrtoo "
");//Export:陣列的新值：One,set Map,Three

方法二：js的concat方法

複製程式碼


程式碼如下:

程式碼如下:此方法不會改變現有的數組，而只會傳回被連接數組的一個副本。 語法

arrayObject.concat(arrayX,arrayX,......,arrayX)

說明
傳回一個新的陣列。這個陣列是透過把所有 arrayX 參數加入到 arrayObject 中產生的。如果要進行 concat() 運算的參數是數組，那麼新增的是數組中的元素，而不是數組。
var arr = ["One","Two","Three"];

例子：

複製代碼 程式碼如下:   var arrtooo = arr.concat();arrtooo[1] = "set Map To";document.writeln("數組的原始值：" arr "
");//Export:陣列的原始值：One,Two,Threedocument.writeln("陣列的新值：" arrtooo "
");/ /Export:陣列的新值：One,set Map To,Three