ES6 数组新用法（一）

《深入理解ES6》阅读随笔

在 ES6 中，对数组功能进行了扩展。可以使用新增的 Array.of() 和 Array.from() 方法来更加便利的创建数组；针对所有数组对象新增了 find()、findIndexof()、fill() 和 copyWithin() 等方法；另外还有重要的新概念：定型数组。今天先介绍一下 Array.of() 和 Array.from()。

Array.of()

之前 ES5 中使用构造函数的方式新建数组时，存在一些使用起来比较指代不清楚的地方，比如：

let arr1 = Array(2);
console.log(arr1, arr1.length); // 输出 [ <2 empty items> ] 2
let arr2 = Array("2"); // 输出 [ '2' ] 1
console.log(arr2, arr1.length);

在初始化时，如果传入参数为整形 2 ，那么会创建一个长度为 2 的数组，如果传入参数为字符串 2，那么会创建一个长度为 1 的数组，并将字符串 2 赋值到数组的第一个元素上。
在 ES6 中，可以使用 Array.of() 的方式进一步明确创建数组，其参数接收任意类型数据，并依次将值赋予到数组中去：

let arr3 = Array.of(2, "2");
console.log(arr3, arr3.length); // 输出 [ 2, '2' ] 2

Array.from()

在 ES5 中，想要将一个对象或者类数组对象转换为数组时，可以通过写程序的方式，从对象中依次取出数据然后再依次插入到数组中去：

function timer() {
  console.log("default:", arguments);
  let list = [];
  for (let i = 0; i < arguments.length; i++) {
    list.push(arguments[i]);
  }
  console.log("new array:", list);
}
timer(1, 2, 3);
// 输出
// default: [Arguments] { '0': 1, '1': 2, '2': 3 }
// new array: [ 1, 2, 3 ]

而在 ES6 中，有了更便捷现成的办法可以直接转换之，可以在 Array.from() 的第一个参数位置传入一个类数组对象，然后直接就可以转换为数组：

function timer() {
  console.log("default:", arguments);
  console.log("Array.from():", Array.from(arguments));
}
timer(1, 2, 3);
// 输出
// default: [Arguments] { '0': 1, '1': 2, '2': 3 }
// Array.from(): [ 1, 2, 3 ]

还可以给第二个参数传入一个处理函数，动态生成新的数组：

 function timer() {
  console.log("default:", arguments);
  console.log(
    "Array.from(+1):",
    Array.from(arguments, (v) => {
      return v + 1;
    })
  ); 
}
timer(1, 2, 3);
// 输出
// default: [Arguments] { '0': 1, '1': 2, '2': 3 }
// Array.from(+1): [ 2, 3, 4 ]

在第三个参数位置还可以传入一个 this 对象，这里不再深入讨论；
另外，Array.from() 还可用于处理字符串、 Set 、Map、生成器等类型。