瞅瞅ES6多好玩——数组篇

两个类方法

1.Array.from()

将类数组和可遍历对象(包括ES6新增的Set和Map)转换为数组

// ES5
var arr = Array.prototype.slice.call(arrayLike);
// ES6
let arr = Array.from(arrayLike)  
// ...展开运算符也可以实现类似操作
let arr = [...arrayLike];

关于该方法与展开运算符的区别，前者支持任何有length属性的对象，而后者做不到

Array.from({length: 3})    // [undefined, undefined, undefined]
[...{length: 3}]           // TypeError: object is not iterable

该方法接受第二个参数用于对每个元素进行处理

// ES5 map()
Array.prototype.slice.call([1,2,3]).map(x => x * x)     // [1, 4, 9]
// ES6
Array.from([1,2,3], x => x * x)    // [1, 4, 9]

2.Array.of()

奥义：无论几个参数，统统变成数组的元素，弥补了Array()由于参数个数不同导致的差异行为的不足

Array.of(3,4,5)  // [3,4,5]
Array(3,4,5)     // [3,4,5]
Array.of(3)      // [3]
Array(3)         // [,,]
Array.of()       // []
Array()          // []

实例方法

1.find()和findIndex()

如你所想，找到数组成员（后者找数组成员索引值）并返回

[1,2,3,4].find((value,index,arr)=>value>3)    // 4
[1,2,3,4].findIndex((value,index,arr)=>value>3)   // 3

可以发现NaN，IndexOf()方法可做不到

[NaN].indexOf(NaN)                    // -1
[NaN].findIndex(x=>Object.is(NaN,x))  // 0

2.fill(item, start, end)

填充数组，方便初始化

new Array(3).fill(6)    // [6,6,6]
[1,2,3].fill(6,1,2)     // [1,6,3]

3.includes(item, start)

检验是否包含某个值

[2,3,3].includes(2);      // true
[2,3,NaN].includes(NaN);  // true
[2,3,4].includes(4,-1)    // true

4.entries()、keys()和values()

这三个方法用于遍历数组。它们都返回一个遍历器对象，可以用for...of进行遍历

// 对键名的遍历
for (let index of ['a', 'b'].keys()) {
  console.log(index);
}
// 0
// 1

// 对键值的遍历
for (let elem of ['a', 'b'].values()) {
  console.log(elem);
}
// 'a'
// 'b'

// 对键值对的遍历
for (let [index, elem] of ['a', 'b'].entries()) {
  console.log(index, elem);
}
// 0 "a"
// 1 "b"

当然也可以手动调用遍历器对象的next方法，进行遍历

let letters = ['a', 'b', 'c'];
let entries = letters.entries();
console.log(entries.next().value); // [0, 'a']
console.log(entries.next().value); // [1, 'b']
console.log(entries.next().value); // [2, 'c']