在前端开发中，处理数组是必不可少的一部分。而在 ES7 中，Array.prototype.flat 方法成为了一个强大的工具，可以为我们扁平化数组提供便捷的解决方案。
什么是 Array.prototype.flat 方法？
Array.prototype.flat 方法是 JavaScript 数组的一种扁平化方法。它可以将嵌套的数组转换为一个单层的数组，即将多维数组变成一维数组。
flat 方法的语法
Array.prototype.flat 方法的语法非常简单，如下所示：
arr.flat([depth])
其中，arr 指的是需要进行扁平化操作的数组，depth 则是可选的，指定需要扁平化的深度。如果不传入 depth 参数，则默认扁平化所有数组的嵌套层数。
flat 方法的应用场景
在前端开发中，我们经常会遇到需要扁平化数组的情况。比如在处理嵌套的 JSON 数据时，需要将多层的嵌套关系转化为一维数组，以便更加便捷地进行数据处理。
flat 方法的示例代码
下面我们通过一些示例来演示 Array.prototype.flat 方法的用法及其在实际工作中的应用。
示例一：扁平化一维数组
在 JavaScript 中，我们可以很容易地声明一个一维数组：
const arr = [1, 2, 3, 4, 5];
如果直接对这个一维数组调用 flat 方法，则会返回与原数组一致的结果，因为它并没有嵌套数组：
console.log(arr.flat()); // [1, 2, 3, 4, 5]
示例二：扁平化二维数组
接下来，我们来看一下如何扁平化二维数组。在JavaScript 中，我们也很容易地声明一个二维数组：
const arr = [ [1, 2], [3, 4, 5], [6, 7], ];
如果直接对这个二维数组调用 flat 方法，则会返回一个一维数组，将所有子数组里的元素都合并成一个数组：
console.log(arr.flat()); // [1, 2, 3, 4, 5, 6, 7]
示例三：扁平化多维数组
我们也可以对多维数组进行扁平化操作。比如对于下面这个三维数组：
const arr = [ [1, 2], [3, [4, [5]]], [6, 7], ];
如果直接对这个三维数组调用 flat 方法，则会返回一个二维数组，将所有子数组里的元素都合并成一个数组：
console.log(arr.flat()); // [1, 2, 3, 4, [5], 6, 7]
此时 [5] 是一个数组，因为扁平化的深度只有 1，flat 方法并没有继续扁平化第三层的 [5]。
如果我们要让所有的子数组都扁平化，并将数组变成一维的，可以传入 Infinity 作为参数，表示对所有层级的嵌套数组进行扁平化：
console.log(arr.flat(Infinity)); // [1, 2, 3, 4, 5, 6, 7]
总结
Array.prototype.flat 方法是数组处理中一个强大的工具，可以为我们扁平化数组提供更加便捷的解决方案。我们可以通过它轻松地将多维的嵌套数组变成一维的，从而更加便捷地进行数据处理。在实际的开发中，我们常常需要面对数组数据的处理，因此熟练掌握 Array.prototype.flat 方法不仅可以提高我们的开发效率，还能够帮助我们设计更加优美的代码。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/654b3e267d4982a6eb528e65