ES10 中新增了 Array.prototype.flat() 函数的语法与用法

ES10 中新增了 Array.prototype.flat() 函数的语法与用法

在 ES10（ECMAScript 2019）版本中，JavaScript 新增了一个非常方便的数组操作方法：Array.prototype.flat()。该方法的主要作用是将多维数组转化为一维数组，并且可以控制转化的深度。Array.prototype.flat() 的使用非常简单，语法如下：

arr.flat([depth]);

其中，arr 表示要转化的数组，depth 表示转化的深度，默认值是 1。当 depth 等于 Infinity 的时候，则会将多维数组全部展开为一维数组。

下面我们来看一些具体的用例和示例代码。

用法一：将多维数组转化为一维数组

首先，我们来看一个简单的用例，它将一个包含多个一维数组的二维数组转化为一个一维数组：

const arr = [[0, 1], [2, 3], [4, 5]];
const result = arr.flat();
console.log(result); // [0, 1, 2, 3, 4, 5]

从上面的代码可以看出，当我们调用 arr.flat() 的时候，它会默认将二维数组展开成为一个一维数组。

用法二：控制转化的深度

当我们需要将一个多维数组展开成为一个特定深度的一维数组时，可以使用 depth 参数来指定转化的深度。例如：

const arr = [[1, 2], [3, [4, 5]]];
const result = arr.flat(1);
console.log(result); // [1, 2, 3, [4, 5]]

从上面的代码可以看出，当我们将 depth 参数设置为 1 的时候，它只将一维数组展开成为一维数组，而不会展开多维数组。

用法三：将不规则的多维数组转化为一维数组

在实际开发中，我们有时候会遇到一些不规则的多维数组，例如：

const arr = [1, [2, 3], [[4, 5], [6, 7]]];

这种数组在使用其他方法展开时会非常繁琐，而 flat 方法可以很好地解决这个问题，示例如下：

const arr = [1, [2, 3], [[4, 5], [6, 7]]];
const result = arr.flat(Infinity);
console.log(result); // [1, 2, 3, 4, 5, 6, 7]

从上面的代码可以看出，当我们将 depth 参数设置为 Infinity 的时候，它会将多维数组全部展开成为一维数组。

总结

Array.prototype.flat() 方法是 JavaScript 中一个非常实用的数组操作方法，它可以帮助我们轻松地将多维数组转化为一维数组，并且可以控制转化的深度。使用 flat 方法，我们可以简化多维数组展开的操作，并且提高代码的可读性和可维护性。

希望本篇文章对大家的学习有所帮助，也希望大家在使用 flat 方法的时候多加注意控制深度，以免造成不必要的错误和 bug。

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