es6-數組擴展
es6-數組擴展
來自專欄前端知識筆記
數組新增特性
- Array.from
- Array.of
- copyWithin
- findfindIndex
- fill
- entrieskeysvalues
- includes
Array.from
集合轉數組
{ let p=document.querySelectorAll(p); let pArr=Array.from(p); // 集合轉數組 pArr.forEach(function(item){ console.log(item.textContent); });}
實現類似 map() 的遍歷
{ // Array.from()第二個參數,接收一個函數,進行遍歷 console.log(Array.from([1,3,5],function(item){return item*2})); // [2, 6, 10],參數2是函數,類似 map()}
Array.of
{ let arr = Array.of(3,4,7,9,11); console.log(arr=,arr); // [3, 4, 7, 9, 11]? let empty=Array.of(); console.log(empty,empty); // []}
填充數組
fill
{ console.log(fill-7,[1,a,undefined].fill(7)); // [7, 7, 7] console.log(fill,pos,[a,b,c].fill(7,1,3)); // ["a", 7, 7],參數1,替換數,參數2和參數3,起始和截止位置}
遍歷
keys,數組元素的位置
{ for(let index of [1,c,ks].keys()){ console.log(keys,index); // 0 1 2 }}
values,數組元素的值
注意,需要 babel-polifill 兼容
{ for(let value of [1,c,ks].values()){ console.log(values,value); // 1 c ks }}
entries,數組元素的位置和值
{ for(let [index,value] of [1,c,ks].entries()){ console.log(values,index,value); // 0 1換行1 c換行2 ks }}
用數組本身元素進行替換
{ console.log([1,2,3,4,5].copyWithin(0,3,4)); // [4, 2, 3, 4, 5],參數1,替換起始位置,參數2,讀取數據起始位置,參數3,讀取截止位置(不包括)}
查找
find,第一個符合條件的元素
findeIndex,第一個符合條件的元素的位置
{ console.log([1,2,3,4,5,6].find(function(item){return item>3})); // 4,第一個符合條件的元素 console.log([1,2,3,4,5,6].findIndex(function(item){return item>3})); // 3,第一個符合條件的元素的位置}
是否包含
{ console.log(number,[1,2,NaN].includes(1)); // true console.log(number,[1,2,NaN].includes(NaN)); // true,能識別 NaN}
推薦閱讀: