随着 JavaScript 技术的不断发展，ECMAScript 2020 新增了很多有用的方法，其中 Array.prototype.flat() 就是其中之一。在本篇文章中，我们将深入浅出地讲解这个方法的使用，并为大家演示其具体实现。
理解 Array.prototype.flat() 方法
在正题开始前，我们首先需要了解什么是 Array.prototype.flat() 方法。
这个方法可以将一个多维的数组变成一个一维的数组。具体而言，它会按照一定的深度遍历数组中的每一个元素，然后将所有元素放入一个新的数组中，从而将多维数组转换成一维数组。
什么时候使用 Array.prototype.flat() 方法
当我们需要将一个多维数组转换成一维数组时，就可以使用 Array.prototype.flat() 方法。
例如，我们有一个二维数组，每一行中都包含了若干个元素。如果我们想将所有元素放入一个一维数组中，就可以使用 flat() 方法。
怎样使用 Array.prototype.flat() 方法
那么，如何使用 flat() 方法呢？首先，我们需要调用这个方法，并将需要被转换的多维数组作为参数传入。
简单例子
让我们来看一个简单的例子，来说明 flat() 方法的基本用法。
--- --- - - --- -- --- --- -- --- --- -- --- -- --- ------- - ----------- --------------------- -- --- -- -- -- -- -- -- -- --
在这个例子中，我们有一个二维数组（arr）。我们想将其中的所有元素存放在一个一维数组中。我们调用 flat() 方法，即可得到这个一维数组（flatArr）。
指定深度
除了默认的深度遍历外，我们还可以通过参数指定遍历的深度。
例如，如果我们只想遍历一次，即将多维数组转换成为一维数组，我们可以将参数设置为 1。
--- --- - - --- -- --- ---- --- -- --- ---- -- --- ------- - ------------ --------------------- -- --- -- -- -- -- -- -- --
在这个例子中，我们将数组 arr 展开到深度为 1 的数组中。因此，扁平化后的数组（flatArr）只包含了数字。
使用 Infinity 参数
如果我们想要展开整个多维数组，而不管它的层数如何，我们可以使用 Infinity 参数。
--- --- - - --- --- --- ------- --- --- -- --- ------- - ------------------- --------------------- -- --- -- -- -- -- --
在这个例子中，我们将数组展开到了最深层级（Infinity）的数组中。因此，flatArr 包含了所有数字，且被展开为一个一维数组。
使用 map() 方法
有时，我们想要对扁平化后的数组执行特定的操作。此时，我们可以使用 map() 方法。
--- --- - - --- --- --- --- --- --- -- --- ------- - ---------------- -- - - --- --------------------- -- --- -- -- -- --- ---
在这个例子中，我们将数组 arr 展开到了一维数组 flatArr 中。接着，我们使用 map() 方法将 flatArr 中的每个元素都乘以 2。
总结
Array.prototype.flat() 方法可以将多维数组转换成为一维数组。在使用时，我们需要调用 flat() 方法，并将需要被转换的多维数组作为参数传入。我们也可以使用一个数值参数来指定需要遍历的深度，或使用 Infinity 参数将数组整体展开，并使用 map() 方法对其执行特定的操作。
美滋滋的代码：
--- --- - - --- --- --- ------- --- --- -- --- ------- - ------------------------ -- - - - --- - - ----- - --- --------------------- -- ------- ------ -- ------ ------ ------
以上就是本篇文章的全部内容。现在，你已经了解了 Array.prototype.flat() 方法的基本用法，以及在实际开发中的注意事项。希望这篇文章可以帮助您在日常工作中更加熟练地使用 JavaScript。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6521337f95b1f8cacd8b2dc5