ES6(ECMAScript 6)笔记6-数组的扩展

Array.from()

将类数组和可遍历的对象转换为真正的数组。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
let ps = document.querySelectorAll('p');

Array.from(ps).forEach(function (p) {
  console.log(p);
});

function foo() {
  var args = Array.from( arguments );
}

foo( "a", "b", "c" );

Array.from({ 0: "a", 1: "b", 2: "c", length: 3 });
// [ "a", "b" , "c" ]

同时接受第二个参数,作用类似于map方法,对每个元素进行处理。

Array.of()

将一组值转换为数组。

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

数组实例的find()和findIndex()

find方法用于找出第一个符合条件的数组成员,如果没找到返回undefined。
findIndex方法类似find,只是返回的是索引位置,没找到返回-1。

1
2
3
[1, 5, 10, 15].find(function(value, index, arr) {
  return value > 9;
}) // 10

数组实例的fill()

使用给定值,填充一个数组,第二和第三个参数用来指定填充的开始位置和结束位置。

1
2
3
4
5
6
7
8
['a', 'b', 'c'].fill(7)
// [7, 7, 7]

new Array(3).fill(7)
// [7, 7, 7]

['a', 'b', 'c'].fill(7, 1, 2)
// ['a', 7, 'c']

数组实例的entries(),keys()和values()

它们都返回一个遍历器可以用for…of循环遍历,区别在于:

  • keys() 返回键名
  • values() 返回键值
  • entries() 返回键值对
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
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"