JS初始化數(shù)組的幾種方法

1. Array.prototype.fil()

用給定值填充數(shù)組

初始化
let array = new Array(5).fill(false);
console.log(array);
//顯示如下
//[false, false, false, false, false]
指定范圍改變
let array = [1,1,1,1,1,1];
array.fill(0,1,3); //從下標(biāo)1到下標(biāo)3之前將值改變?yōu)?
console.log(array)
//顯示如下
//[1, 0, 0, 1, 1, 1]

2. Array.from() 方法:

Array.from方法用于將兩類對象轉(zhuǎn)為真正的數(shù)組:類數(shù)組的對象( array-like object )和可遍歷( iterable )的對象(包括 ES6 新增的數(shù)據(jù)結(jié)構(gòu) Set 和Map )。

let arrayLike = {  
  '0': 'a',  
  '1': 'b',  
  '2': 'c',  
  length: 3  
};  
// ES5 的寫法  
var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']  
// ES6 的寫法  
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']  
  
// NodeList 對象  
let ps = document.querySelectorAll('p');  
Array.from(ps).forEach(function (p) {  
  console.log(p);  
});  
// arguments 對象  
function foo() {  
var args = Array.from(arguments);  
// ...  
}  

//字符串轉(zhuǎn)換為字符數(shù)組str.split('')  
Array.from('hello')  // ['h', 'e', 'l', 'l', 'o']  
let namesSet = new Set(['a', 'b'])  
Array.from(namesSet) // ['a', 'b']  
  
Array.from({ length: 3 });  // [ undefined, undefined, undefined ]  

對于還沒有部署該方法的瀏覽器,可以用Array.prototype.slice方法替代:

const toArray = (() =>
  Array.from ? Array.from : obj => [].slice.call(obj)
)();

Array.from還可以接受第二個參數(shù),作用類似于數(shù)組的map方法,用來對每個元素進行處理,將處理后的值放入返回的數(shù)組。

Array.from(arrayLike, x => x * x);  
//  等同于  
Array.from(arrayLike).map(x => x * x);  
Array.from([1, 2, 3], (x) => x * x)  
// [1, 4, 9]  
//Array.from回調(diào)函數(shù)
var arr1 = Array.from([1,2,3], function(item){
    return item*item;
});
var arr2 = Array.from([1,2,3]).map(function(item){
    return item*item;
});
var arr3 = Array.from([1,2,3], (item) => item*item);

console.log(arr1); //[ 1, 4, 9 ]
console.log(arr2); //[ 1, 4, 9 ]
console.log(arr3); //[ 1, 4, 9 ]

值得提醒的是,擴展運算符(...)也可以將某些數(shù)據(jù)結(jié)構(gòu)轉(zhuǎn)為數(shù)組。

// arguments 對象  
function foo() {  
  var args = [...arguments];  
}  
// NodeList 對象  
[...document.querySelectorAll('div')]  

3. Array.of()

Array.of方法用于將一組值,轉(zhuǎn)換為數(shù)組。Array.of總是返回參數(shù)值組成的數(shù)組。如果沒有參數(shù),就返回一個空數(shù)組。

Array.of基本上可以用來替代Array()或new Array(),并且不存在由于參數(shù)不同而導(dǎo)致的重載。它的行為非常統(tǒng)一。

這個方法的主要目的,是彌補數(shù)組構(gòu)造函數(shù)Array()的不足。因為參數(shù)個數(shù)的不同,會導(dǎo)致Array()的行為有差異

Array() // []  
Array(3) // [, , ,]  
Array(3, 11, 8) // [3, 11, 8]  
  
Array.of() // []  
Array.of(3) // [3]  
Array.of(3, 11, 8) // [3,11,8]  
  
Array.of(3).length // 1   
Array.of(undefined) // [undefined]  
Array.of(1) // [1]  
Array.of(1, 2) // [1, 2]  

Array.of方法可以用下面的代碼模擬實現(xiàn):

function ArrayOf(){
  return [].slice.call(arguments);
}

點贊加關(guān)注,永遠不迷路

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容