在前端开发中，数组是我们经常使用的一种数据结构，它可以帮助我们存储和处理多个相似的数据。ES6 中新增了很多数组操作方法，例如 Array.forEach、Array.map、Array.filter 等，它们大大简化了我们对数组的操作。而在 ES7 中，又新增了一个方法——Array.of。本文将介绍它在数据操作中的应用技巧。
Array.of 的作用
在 ES6 中，我们可以使用 Array 构造函数来创建一个数组。例如：
let arr1 = new Array(3); // 创建一个长度为 3 的空数组 let arr2 = new Array(1, 2, 3); // 创建一个包含 1、2、3 三个元素的数组
但是，使用 Array 构造函数来创建数组时，有一个非常容易出错的问题。如果你想要创建一个包含一个元素的数组，例如 [1]，那么你可能会这样写：
let arr = new Array(1); arr[0] = 1;
这种写法看起来没什么问题，但是当你要创建一个包含多个元素的数组时，就会发现这种写法很不方便。因为你需要记得数组的长度，并且还要在后面逐个赋值。如果你写成了这样：
let arr = new Array(1, 2, 3);
那么你就会得到一个长度为 3 的空数组。
为了解决这个问题，ES7 中新增了 Array.of 方法。它可以接收任意数量的参数，并返回一个包含这些参数的数组。例如：
let arr1 = Array.of(1); // 创建一个包含一个元素 1 的数组 let arr2 = Array.of(1, 2, 3); // 创建一个包含三个元素 1、2、3 的数组
Array.of 方法不仅在写法上更加简单明了，还避免了使用 Array 构造函数时可能会出现的错误情况。
与 Array 构造函数的区别
虽然 Array.of 方法可以代替 Array 构造函数来创建数组，但是它们并不完全相同。在使用 Array.of 方法时，如果你传入的参数是一个数组，那么它会将这个数组作为一个整体放入新数组中。例如：
let arr1 = Array.of(1, [2, 3]); // 创建一个包含两个元素 1、[2, 3] 的数组 let arr2 = new Array(1, [2, 3]); // 创建一个包含两个元素 1、[2, 3] 的数组
可以看到，与 Array 构造函数不同的是，Array.of 方法并没有将数组展开。这是因为 Array.of 方法的设计初衷就是为了避免使用 Array 构造函数时出现的问题，所以它更倾向于将所有参数都看作是要放入新数组中的元素。
另外，如果你给 Array 构造函数传入一个数字 n 作为参数，那么它会创建一个长度为 n 的空数组。而如果你给 Array.of 方法传入一个数字 n 作为参数，那么它会创建一个包含一个元素为 n 的数组。例如：
let arr1 = new Array(3); // 创建一个长度为 3 的空数组 let arr2 = Array.of(3); // 创建一个包含一个元素 3 的数组
需要注意的是，如果你给 Array.of 方法传入的参数是一个数组，而这个数组只有一个元素，那么得到的就是一个包含这个元素的数组。这与直接使用这个元素作为参数的效果是相同的。例如：
let arr1 = Array.of([1]); // 创建一个包含一个元素 [1] 的数组 let arr2 = Array.of(1); // 创建一个包含一个元素 1 的数组
Array.of 的应用
Array.of 方法的应用场景很广泛，特别是在函数编程中。下面是一些使用 Array.of 方法的示例。
创建一个空数组
有时候我们需要创建一个空数组，例如用来存储某些操作的结果。如果使用 Array 构造函数，就需要像下面这样写：
let arr = new Array(); // 创建一个空数组
但是这样写有些啰嗦，使用 Array.of 方法就更加简单：
let arr = Array.of(); // 创建一个空数组
创建一个包含多个元素的数组
有时候我们需要创建一个包含多个元素的数组，例如用来进行某些计算。如果使用 Array 构造函数，就需要记住要给它传入多个参数，然后再一一赋值。但是使用 Array.of 方法就更容易：
let arr1 = Array.of(1, 2, 3); // 创建一个包含三个元素 1、2、3 的数组
let arr2 = Array.of('a', 'b', 'c'); // 创建一个包含三个元素 'a'、'b'、'c' 的数组使用展开运算符来创建数组
展开运算符可以方便地将一个可迭代对象转成一个数组。例如：
let arr1 = [...'abcd']; // 创建一个包含四个元素 'a'、'b'、'c'、'd' 的数组 let arr2 = [...[1, 2, 3]]; // 创建一个包含三个元素 1、2、3 的数组
但是如果你想创建一个只包含一个元素的数组，就不能使用展开运算符。这时候可以使用 Array.of 方法：
let arr = Array.of(...[1]); // 创建一个包含一个元素 1 的数组
总结
Array.of 方法是 ES7 中新增的一个方法，它可以方便地创建一个包含任意数量元素的数组。与 Array 构造函数相比，它更简单明了，并且避免了可能出现的问题。在函数编程中，它也是一个非常实用的工具，可以帮助我们更加方便地处理数据。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64dec9dcf6b2d6eab39e9c9b