ECMAScript 2016 新特性：对 Array 的扩展 -- Array.prototype.flat

在 ECMAScript 2016 中，有一个新的数组的实例方法 Array.prototype.flat()，它可以方便地将嵌套的数组减少为一个单层的数组。在本文中，我们将学习这个新特性的详细内容、学习它的使用方法以及探讨它的指导意义。

flat() 方法介绍

在过去的 JavaScript 中，我们可能会遇到一个多维数组，它们看起来像这样:

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

此时，如果我们想将此数组变为单一的一维数组，我们可能不得不使用递归或之前的一些 JavaScript API，如 concat() 或 reduce()，这样一来代码会比较复杂。

let flatArr = arr.toString().split(',').map(Number);
console.log(flatArr); // [1, 2, 3, 4, 5, 6]

但是，在 ECMAScript 2016 中引入的 flat() 方法可以使这个过程变得更加直观和简单。

我们来看一下 flat() 的用法:

let flatArr = arr.flat();
console.log(flatArr); // [1, 2, 3, 4, [5, 6]]

这样是不是更加简单易懂呢？ flat() 方法可以将多维数组中的第一层子元素摊平成一个单一的一维数组，它的默认的递归深度为 1。如果你想扁平化一个多维数组，你可以多次使用 flat() 方法，或者将 Infinity 传递给其递归的深度参数。

let arr = [1, 2, [3, 4, [5, 6]]];
let flatArr = arr.flat(2);
console.log(flatArr); // [1, 2, 3, 4, 5, 6]

除了 flat() 方法的 depth 参数外，它还支持一个可选的 callback 函数，可以对扁平化的结果进行自定义的处理。

深入分析

这种处理数组的方式真的非常有用，让我们来更细致地学习一下。下面是几个简单的例子，它们展示了在使用 flat() 方法时可以遇到的一些情况：

1. 将所有的嵌套数组扁平化为一个数组

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

1. 使用 flatMap() 方法，将数组扁平化，并进行转换

let arr2 = [1, 2, 3, 4];

let flatMapped = arr2.flatMap(x => [x * 2]);
console.log(flatMapped); // [2, 4, 6, 8]

1. 如果没有任何元素打平了，则 flat() 始终返回原始数组。

let arr3 = [[1], [2], [3]];
let flatArr3 = arr3.flat();
console.log(flatArr3); // [1, 2, 3]

学习和使用建议

为了更好地使用 flat() 方法，我们提供以下几个建议：

1. 如果您知道您的数组是多少级嵌套的，请将此事告诉 flat()，它可以执行更快。

2. 在处理数据之前，请始终确保您的输入数据已经过验证。

3. 使用 flatMap() 方法时，请记得它将原始数组与 map() 和 flat() 方法组合对其进行处理。

4. 数组方法一般都不会对原数组进行修改，而是返回一个新的数组。所以要记得重新赋值。

总结

这篇文章介绍了 ECMAScript 2016 中针对数组类型的新特性 Array.prototype.flat() 方法，它可以方便地将多维数组扁平化成一维数组，从而简化我们的代码。我们详细讲解了 flat() 方法的用法和特性，并提供了使用和学习的建议。希望这篇文章对你有所帮助。

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