ES10 中新增的 Array 中的方法实战

ES10 中新增了 Array 中的三个方法：Array.flat()、Array.flatMap() 和 Array.at()。这些新功能可以让我们更轻松地处理数组数据，做到更好的性能和可读性。在本文中，我们将详细介绍这三个方法的使用和学习，帮助您更好地掌握它们。

Array.flat()

Array.flat() 方法用于将嵌套数组平铺为一个简单的一维数组。它可以减少嵌套数组的复杂度，也可以减少对嵌套数组进行各种操作的次数。

下面是一个使用 Array.flat() 的例子：

const nestedArray = [1, [2, [3, [4, 5]]]];
const flatArray = nestedArray.flat(Infinity);
console.log(flatArray); // [1, 2, 3, 4, 5]

在上面的代码中，我们有一个嵌套数组。我们可以使用 Array.flat() 方法将其平面化为一个简单的一维数组。在这里，我们使用了 Infinity 参数来指定我们要将数组平铺到多深的级别。

Array.flat() 方法还可以使用嵌套数组的深度值来指定要平铺的级别。例如，如果您只想将嵌套数组的第一级平铺为一维数组，可以像这样使用 Array.flat(1)。

Array.flatMap()

与 Array.map() 方法类似，Array.flatMap() 方法也可用于操作数组。但是，其返回值必须是一个简单的一维数组，而不是像 Array.map() 方法那样返回一个嵌套数组。

使用 Array.flatMap() 方法可以减少嵌套的数组，同时使代码更简洁和易读。下面是一个使用 Array.flatMap() 的简单示例：

const array = [1, 2, 3, 4, 5];
const newArray = array.flatMap(num => [num * 2]);
console.log(newArray); // [2, 4, 6, 8, 10]

在上面的代码中，我们使用 Array.flatMap() 方法遍历了一个数组。num * 2 是我们想要操作的每个元素的值。在 Array.flatMap() 内部，我们可以返回一个一维数组，用于将所得到的值添加到末尾数组中。

Array.at()

Array.at() 方法用于获取指定位置的元素。该方法可以通过指定索引值来获取数组的特定元素。

下面是一个使用 Array.at() 的简单示例：

const array = ['a', 'b', 'c', 'd', 'e'];
console.log(array.at(2)); // 'c'

在上面的代码中，我们使用 Array.at() 方法获取了数组中索引为 2 的元素。该方法还可以从数组的末尾开始计算索引值。例如，如果您想获取数组的最后一个元素，可以这样使用 array.at(-1)。

总结

在本文中，我们详细介绍了 ES10 中新增的 Array.flat()、Array.flatMap() 和 Array.at() 方法的使用和学习。这些方法可以使我们更轻松地处理数组数据，并提高代码的性能和可读性。无论您是初学者还是有经验的开发人员，这些新功能都能为您的开发工作带来很大帮助。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/646386d1968c7c53b048ec1a