Array.of() 和 Array.from() 的奇怪用法？答案

【问题标题】：Weird usage of Array.of() and Array.from()?Array.of() 和 Array.from() 的奇怪用法？
【发布时间】：2016-01-13 06:30:10
【问题描述】：

ES6、Array.of() 和Array.from() 中有两个新的方法Array。在page中提到了它们的不同用法。

但是，我对 Array.of 在这个 line 中的用法感到困惑

// usage of Array.of
console.log(
    Array.of( "things", "that", "aren't", "currently", "an", "array" )
); // ["things", "that", "aren't", "currently", "an", "array"]

如果我们像下面那样做，

console.log(
    [ "things", "that", "aren't", "currently", "an", "array" ]
); // ["things", "that", "aren't", "currently", "an", "array"]

我们可以得到与console.log(Array.of(...)) 相同的结果。在这里使用Array.of 有什么好处吗？

还与 Array.from 在此 line 中的用法混淆

var divs = document.querySelectorAll("div");
console.log(
    Array.from( divs )
);

如果上面的代码中没有Array.from怎么办。

var arr = [1, 2, 3];
console.log(Array.from(arr)); // [1, 2, 3]
console.log(arr); // [1, 2, 3]

在这里使用Array.from 有什么好处？

【问题讨论】：

使用Array.of 对数组字面量没有任何好处。使用Array.of 比使用new Array 有一个优势。
在数组上使用Array.from 没有任何好处。在类似数组的对象（例如NodeList）上使用Array.from 有一个优势。
每个帖子只问一个问题。

标签： javascript arrays ecmascript-6

【解决方案1】：

Array.of()

Brendan eich 说 (Source)：

Dmitry A. Soshnikov 写道：

Brendan Eich 写道：

所以 Array.of 的目标是提供一个构造函数，它不同于 Array，没有 Array(42) 的那种疯狂的特殊情况，它预设长度（以及实现预分配的提示）但是在 [0, length) 中留下孔洞。

我仍然看不出它对手动枚举有什么帮助可以直接传递给数组初始化器括号的项目。我们在这里枚举（手动）项目，对吗？ --Array.of(1, 2, 3)。和我们在这里列举项目（也用手）——[1, 2, 3]。区别是第二种情况在语法上更优雅、更甜美也不需要通过分配激活不需要的功能调用栈帧等

这都是真的，但不是重点。用例是当你不能写一个文字，因为你正在传递一个构造为的函数一个函数参数，最终调用者可能只传递一个数字参数，或者几个参数。在这种情况下，Array 不会在一个数字参数的情况。

这就是Array.of的原因。

例子：

// Array.of(42) creates an array with a single element, 42, whereas Array(42) creates an array with 42 elements, each of which is undefined.
console.log(new Array(42));
console.log(Array.of(42));

Array.from()

Array.from() 方法从类数组或可迭代对象创建一个新的 Array 实例。

类数组对象（具有长度属性和索引元素的对象）
可迭代对象（您可以从中获取其元素的对象，例如 Map 和 Set）。

例如：

var m = new Map([[1, 2], [2, 4], [4, 8]]);
console.log("m is:");
console.log(m);

var _from = Array.from(m);
console.log("After .from: ");
console.log(_from);

【讨论】：