javascript複製數組的三種方式
在前端開發中,複製數組是經常用到的功能。現在老K為大家總結一下javascript中複製數組的三種方式。
這是一種使用最普遍的方式。利用js的for循環再生成一個相同的數組。代碼如下:
var arr=[1,2,3];
var arr2=[];
for(var i=0; i<arr.length; i++){
arr2[i]=arr[i];
}
console.log(arr, arr2);
輸出:
[1,2,3] [1,2,3]
為了驗證arr2不是簡單的類型引用,我們可以對arr2進行一個小操作,驗證arr2確實是arr1的複製品。代碼如下:
var arr=[1,2,3];
var arr2=[];
for(var i=0; i<arr.length; i++){
arr2[i]=arr[i];
}
arr2.pop(); //將arr2的最後一項刪掉
console.log(arr, arr2);
輸出:
[1,2,3] [1,2]
對arr2進行操作,不影響arr1。由此驗證,arr2是arr1的複製品。當然這種方式比較繁瑣。
2.ES6的Array.from()
ES6的Array.from 方法用於將兩類對象轉為真正的數組:類似數組的對象(array-like object)和可遍曆(iterable)的對象(包括ES6新增的數據結構Set和Map)。我們可以利用這個特性來快速複製數組。代碼如下:
var arr = [1,2,3];
var arr2 = Array.from(arr); //利用ES6的Array.from生成一個新數組
arr2.pop(); //將arr2的最後一項刪掉,驗證arr和arr2屬於兩個不同的數組
console.log(arr,arr2);
輸出:
[1,2,3] [1,2]
3.ES6的擴展運算符(...)
這是ES6規範新加的一種運算符,可以將某些數據結構轉化為數組。我們可以利用擴展運算符的特性來快速複製數組。代碼如下:
var arr = [1,2,3];
var arr2 = [...arr]; //利用ES6的擴展運算符生成一個新數組
arr2.pop(); //將arr2的最後一項刪掉,驗證arr和arr2屬於兩個不同的數組
console.log(arr,arr2);
輸出:
[1,2,3] [1,2]
歡迎關注個人公眾號,查看更多好文。
最後更新:2017-08-13 22:34:10