使用slice和concat對陣列的深拷貝和淺拷貝

2022-09-15 17:18:11 字數 3097 閱讀 2237

本文**:

一、陣列淺拷貝

在使用j**ascript對陣列進行操作的時候,我們經常需要將陣列進行備份.

如下**,如果只是簡單才用賦值的方法,那麼我們只要更改其中的任何乙個,然後其他的也會跟著改變,這就導致了問題的發生

var arr1 = ["red","yellow","black"];

var arr2 =arr1;

arr2[1] = "green";

console.log("陣列的原始值:" +arr1 );

console.log("陣列的新值:" + arr2);

測試結果如下:

像上面的這種直接賦值的方式就是陣列的淺拷貝,淺拷貝改變其中乙個陣列,另外乙個陣列也會跟著改變。很多時候,這不是我們想要的。

二、陣列深拷貝方法

(1)js的slice方法

對於array物件的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 之前,不複製任何元素到新陣列中。

測試例子:

var arr1 = ["1","2","3"];

var arr2 = arr1.slice(0);

arr2[1] = "9";

console.log("陣列的原始值:" +arr1 );

console.log("陣列的新值:" + arr2 );

測試結果:

如測試結果顯示,通過js的slice方法,改變拷貝出來的陣列的某項值後,對原來陣列沒有任何影響。

(2)js的concat方法

concat() 方法用於連線兩個或多個陣列。該方法不會改變現有的陣列,而僅僅會返回被連線陣列的乙個副本。

語法:arrayobject.concat(arrayx,arrayx,......,arrayx)

說明:返回乙個新的陣列。該陣列是通過把所有 arrayx 引數新增到 arrayobject 中生成的。如果要進行 concat() 操作的引數是陣列,那麼新增的是陣列中的元素,而不是陣列。

測試例子:

var arr1 = ["1","2","3"];

var arr2 =arr1.concat();

arr2[1] = "9";

console.log("陣列的原始值:" +arr1 );

console.log("陣列的新值:" + arr2 );

測試結果:

如測試結果顯示,通過js的concat方法,改變拷貝出來的陣列的某項值後,對原來陣列沒有任何影響。

(3)js遍歷陣列的方法

測試例子:

var arr1 = [1,2,3];//

原來陣列

var arr2 = ;//

新陣列function

deepcopy(arry1, arry2)

}deepcopy(arr1, arr2);

arr2[0] =5;

console.log(arr1);

console.log(arr2);

測試結果:

三、slice,concat方法的侷限性

測試例子1:

var arr1 = [,];//

原陣列var arr2 = .concat(arr1);//

拷貝陣列

arr1[1].name="girl";

console.log(arr1);

//[,]

console.log(arr2);//

[,]

測試例子2:

var a1=[["1","2","3"],"2","3"];

a2=a1.slice(0);

a1[0][0]=0; //

改變a1第乙個元素中的第乙個元素

console.log(a2[0][0]); //

影響到了a2

var b1=[["1","2","3"],"2","3"];

b2=b1.slice(0);

b1[0][0]=0; //

改變a1第乙個元素中的第乙個元素

console.log(b2[0][0]); //

影響到了a2

從上面兩個例子可以看出,由於陣列內部屬性值為引用物件,因此使用slice和concat對物件陣列的拷貝,整個拷貝還是淺拷貝,拷貝之後陣列各個值的指標還是指向相同的儲存位址。

因此,slice和concat這兩個方法,僅適用於對不包含引用物件的一維陣列的深拷貝

js中concat函式使用

concat 方法用於連線兩個或多個陣列。該方法不會改變現有的陣列,而僅僅會返回被連線陣列的乙個副本。arrayobject.concat arrayx,arrayx,arrayx 返回乙個新的陣列。該陣列是通過把所有 arrayx 引數新增到 arrayobject 中生成的。如果要進行 conc...

mysql的concat使用示例

concat 在sql語句中直接拼接位址 不需要再foreach迴圈 concat config img url pic.imgurl as imgurl 示例 where result this alias ac where where join getdbprefix picture pic a...

concat 和 group concat的陷阱

group concat mysql中group concat函式能將相同的行組合起來 完整的語法如下 group concat distinct 要連線的字段 order by asc desc 排序字段 separator 分隔符 使用示例 select from aa id name 1 10...