ECMAScript 2021 中的 Array.of 方法的用法-FunTeaLearn Online Web Tutorials

在 ECMAScript 2021 中，JavaScript 引入了一个新的方法叫做 Array.of。本文将详细介绍这个方法的用法，包括参数、返回值和示例代码，并给出一些有关它的深度讨论和指导意义。

Array.of 方法的作用

Array.of 方法用于创建一个数组，该数组包含指定的参数。该方法是 Array 构造函数的一个替代方法，可以避免使用构造函数时的一些奇怪行为。

使用 Array.of 方法可以避免在创建数组时遇到的一些常见问题，如：

举个例子，如果你想要创建一个包含数字 1, 2, 3 的数组：

const arr = new Array(1, 2, 3); // [1, 2, 3]

但是，如果你想要创建一个包含单个数字 3 的数组：

const arr = new Array(3); // [undefined, undefined, undefined]

现在你可以使用 Array.of 方法来解决这个问题：

const arr = Array.of(3); // [3]

Array.of 方法接受任意数量的参数，即使只有一个参数也可以。

Array.of 方法返回一个新的数组，其中包含传递给方法的所有参数作为元素。

下面是使用 Array.of 方法的一些示例代码：

Array.of();            // []
Array.of(undefined);   // [undefined]
Array.of(1);           // [1]
Array.of(1, 2, 'test'); // [1, 2, "test"]

当使用 Array 构造函数时，上面的代码将产生与期望不同的结果。例如，如果我们像下面这样使用构造函数：

new Array(3); // [undefined, undefined, undefined]

就会创建一个包含三个元素的数组，这并不是我们想要的。

使用 Array.of 方法，你可以准确地创建包含所需元素的数组：

Array.of(3);  // [3]
Array.of(1, 2) // [1, 2]

以下是一些有关 Array.of 方法的深度讨论：

在 ECMAScript 2021 中，Array.of 方法也可以处理非传统类型的参数，如 BigInt 和 Symbol：

Array.of(BigInt(9007199254740991)); // [9007199254740991n]
Array.of(Symbol('test'));           // [Symbol(test)]

在很多情况下，Array.of 方法与 Array 构造函数是等价的。例如，下面的两行代码将产生相同的结果：

Array.of(1, 2, 3);
new Array(1, 2, 3);

然而，Array.of 方法在处理单个数字或创建一个元素的数组时更加方便。

在 ECMAScript 5 之前，使用 apply 方法可以将变量数组化，但这种方法应该被避免，因为它可能会破坏代码的可读性：

var arr = Array.apply(null, [1, 2, 3]); // [1, 2, 3]

现在我们可以使用 Array.of 方法来进行相同的操作：

const arr = Array.of(...[1, 2, 3]); // [1, 2, 3]

这种方法更加清晰和易读。

使用 Array.of 方法可以避免在创建数组时遇到的一些常见问题，并提高代码的可读性和清晰度。当你需要创建一个由传递参数组成的数组时，可以使用它。

同时也要注意到 Array.of 方法是在 ECMAScript 2015 中引入的，因此在使用该方法时需要考虑原生支持的浏览器是否满足 ECMAScript 2015 规范。

最后，使用 Array.of 方法不代表一定要放弃 Array 构造函数，根据需要选择最合适的方法。

Source: FunTeaLearn,Please indicate the source for reprints https://funteas.com/post/67d7c8c6a941bf7134df0843