es6 -- 陣列的擴充套件
阿新 • • 發佈:2018-11-12
目錄
陣列建構函式的擴充套件
Array.from()
該方法可以將類陣列物件與可遍歷(iterrable)物件轉換為陣列
類陣列物件:任何具有length屬性的物件。
可遍歷物件:任何部署了Iterrator介面的資料結構,例如: String、Array、set、map等
Array.from('hello');
//['h','e','l','l','o']
//轉換類陣列物件 dom中
var div=document.querySelectorAll('div');
Array.from(div);
//將陣列中為false的成員轉換為0
Array.from([1,,2,4,false,'',5],(n)=>n||0);
Array.of()
該方法用於將一組值轉換為陣列。該方法主要彌補了建構函式的不足。
// new Array var arr=new Array(4); arr.length //4 //es6 Array.of var arr1=Array.of(4) arr.length //1
**:Array.of總是返回引數值組成的陣列。如果沒有引數返回空陣列
陣列原型的擴充套件
copyWithin()
該方法,在當前陣列內部將指定位置的成員複製到其他位置(會覆蓋原有成員),然後返回當前陣列。
引數:
target(必須):從該位置開始替換資料
start(可選) :從該位置開始讀取資料,預設從0。如果為負值,表示倒數。
end(可選): 到該位置前停止讀取資料,預設等於陣列長度。如果為負值,表示倒數。
var arr=[1,2,3,4]; //從索引位置為 2開始複製知道陣列結束,複製到0號位置 arr.copyWithin(0,2); console.log(arr); //[3,4,3,4];
find()
用於找出第一個符合條件的陣列成員。該方法的引數是一個回撥函式,知道找到第一個返回值為true的成員,然後返回該成員。
var res=[1,2,3,4].find(function(value,index,arr){
return value>2;
}); //3
//es6簡寫
var res1=[1,2,3,4].find((item)=>item>2);
findIndex()
該方法用於返回第一個滿足條件的陣列成員的位置,如果都不符合則返回-1
var res=[1,2,3,4].findIndex(function(value,index,arr){
return value>2;
}); //2
//es5中 indexOf採用 === NaN===NaN為false
[NaN].indexOf(NaN); //-1
[NaN].findIndex(value=>Object.is(NaN,value)); //0
fill()
該方法用於給定值填充陣列
new Array(3).fill(1); //[1,1,1]
entries()、keys()、values()
這三個方法用於遍歷陣列。它們都返回一個遍歷器物件。可以for...of迴圈遍歷。keys()是對鍵名的遍歷,values()是對鍵值的遍歷、entries()是對鍵值對的遍歷
for(let index of ['a',1,4].keys()){
console.log(index);
}
//0 1 2
for(let [index,item] of ['a',1,4].entries()){
console.log(index,item);
}
// 0 'a'
// 1 1
// 2 4
includes()
該方法用於判斷陣列中是否包含給定值。有則返回true,否則返回false
[1,2,3].includes(2); //true
//該方法的第二個引數 表示起始位置,預設是從0開始
//如果第二個引數為負數,則表示倒數位置,如果該值超出陣列位置則重置從0開始
[1,2,3].includes(2,1) //true
[1,2,3].includes(2,-1); //false
[1,2,3,4].includes(2,5); //false
[1,2,3,4].includes(2,-5); //true