ES6數(shù)組擴展
1.Array.from()
定義：Array.from()用于將兩類對象轉(zhuǎn)換成真正的數(shù)組：類數(shù)組對象和可遍歷的對象(具有Iterator接口)
1.類似數(shù)組對象
示例
var some = {
"0" : "hello",
"1" : "world",
"2" : "lijaha",
"length" : "3"
}
使用Array.from()方法轉(zhuǎn)換成數(shù)組
var array = Array.from(some);
應(yīng)用中常見的類似數(shù)組對象有：DOM操作返回的NodeList集合以及函數(shù)內(nèi)部的arguments
示例
1.NodeList集合
var list = Array.from(document.querySelectorAll('p'));
list.forEach((element) => console.log(element)); //只有數(shù)組才能使用forEach方法進行遍歷
2.函數(shù)內(nèi)部的arguments
function count() {
var arg = Array.from(arguments);
}
2.可遍歷對象
示例
var sring = 'hello';
var array = Array.from(string); //Array.from('hello')ES6新增數(shù)據(jù)結(jié)構(gòu)Map和Set
//Set數(shù)據(jù)結(jié)構(gòu)
var someSet = new Set(['a', 'b', 'c']);
var array = Array.from(someSet);
//Map數(shù)據(jù)結(jié)構(gòu)
var someMap = new Map([['name', 'lijaha'],['age', '20']);
var array = Array.from(someMap) //會轉(zhuǎn)化成二維數(shù)組
此外螟碎，擴展運算符(...)也可以將具有遍歷器接口(Iterator)的數(shù)據(jù)結(jié)構(gòu)轉(zhuǎn)換成數(shù)組
示例
function count() {
var arg = [...arguments];
}var liat = [...document.querySelectorAll('p')];
所謂類數(shù)組的對象眉菱，本質(zhì)都是擁有l(wèi)ength屬性，任何擁有l(wèi)ength屬性的對象都可以通過Array.from()轉(zhuǎn)換成數(shù)組
Array.from()的第二參數(shù)類似于數(shù)組中的map方法掉分，用來對數(shù)組中的每個元素進行操作俭缓，并返回操作結(jié)果后的新數(shù)組。
示例
var array = [1,2,3];
array.map((x) => x2); //ES5數(shù)組map方法酥郭，map擁有三個參數(shù)华坦，element、index不从、array
Array.from(array,(x) => x2);
2.Array.of()
定義：將一組值轉(zhuǎn)化成數(shù)組
//Array.of主要是用來彌補new Array()構(gòu)造函數(shù)傳參的不足
var array = new Array(); //new一個空組[]
var array = new Array(2); //new一個length為2的數(shù)組[ , ]
var array = new Array(1,2,3); //new一個[1,2,3]數(shù)組
由上面可以看出new Array()根據(jù)傳參個數(shù)的不同而導(dǎo)致不同的重載Array.of()示例
var array = Array.of(); //new一個空數(shù)組
var array = Array.of(2); //[2]
var array = Array.of(1,2,3); //[1,2,3]
3.數(shù)組實例find()和findIndex()
定義：find方法用來找出數(shù)組中第一個符合條件的數(shù)組成員惜姐，findIndex方法用來找出數(shù)組中第一個符合條件的數(shù)組成員的下標
示例
var array = Array.of(1,2,3,4);
array.find((element) => element > 1); //2
array.findIndex((element) => element == 2); //1
可借助Object.is方法來識別NaN，用來彌補indexOf()方法的不足,indexOf內(nèi)部使用‘===’來判斷椿息，因為NaN是一個不確定的數(shù)歹袁，NaN === NaN(false)
[NaN].indexOf(NaN); //-1
[NaN].findIndex((element) => Object.is(NaN,element)); //
4.數(shù)組實例entries()、keys()和values()
定義：用來遍歷數(shù)組寝优，entries()是對鍵值的遍歷宇攻、keys()是對鍵的遍歷、values()是對值得遍歷
示例
var array = Array.of(2,3,4);
//使用entries()方法
for (let [index,element] of array.entries()){
console.log(index,element);
}
//使用keys()方法
for (let key of array.keys()){
console.log(key);
}
//使用values()方法
for (ler value of array.values()){
console.log(value);
}
5.數(shù)組實例Array.includes()
ES7方法倡勇，Array.includes()方法返回一個布爾值逞刷，表示數(shù)組是否含有給定的值
示例
var array = [2,3,4];
array.includes(3); //true
array.includes(5); //false
使用includes()可避免對indexOf()方法對NaN的誤判
[NaN].includes(NaN); //true
