Array.prototype.flat() 和 flatMap()

在 JavaScript 中处理数组时，flat() 和 flatMap() 是非常有用的函数。它们帮助简化了对多级嵌套数组的操作。在这篇文章中，我们将探讨这两个方法的区别、如何使用它们，并通过一些示例代码来展示它们的实际应用。

1. flat()

Array.prototype.flat() 方法用于将一个或多个层级的嵌套数组扁平化为单一的一维数组。它接收一个参数，表示要扁平化的最大深度。

示例代码：

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

// 使用 flat() 方法将嵌套数组扁平化为一维数组
const flatArray = nestedArray.flat(2); // 指定最大深度为 2
console.log(flatArray); // 输出: [1, 2, 3, 4, 5, 6, 7, 8]

在这个例子中，我们使用 flat(2) 来指定最多扁平化两层。如果不提供参数，flat() 默认将所有嵌套级别都扁平化。

2. flatMap()

Array.prototype.flatMap() 方法类似于 map() 函数，但它将每一项传递给一个回调函数，并对返回值进行扁平化。这意味着它不仅能改变数组的内容，还能改变数组的结构。

示例代码：

const numbers = [1, 2, 3];
const doubledNumbers = numbers.flatMap(num => [num, num * 2]);
console.log(doubledNumbers); // 输出: [1, 2, 2, 3, 6]

const nestedArray = [
  [1, 2],
  [3, 4],
  [5, 6]
];
const flatNestedArray = nestedArray.flatMap(arr => arr);
console.log(flatNestedArray); // 输出: [1, 2, 3, 4, 5, 6]

在这个例子中，我们看到 flatMap() 能够执行更复杂的操作，比如创建新数组的同时扁平化它。在第二个例子中，原始的二维数组被转换成了一维数组。

3. 区别

• flat() 主要用于简单地将嵌套数组扁平化成一维数组，而 flatMap() 则可以在扁平化的同时应用一个映射函数。
• flat() 的输出是扁平化后的数组，而 flatMap() 的输出则取决于映射函数的结果。
• flat() 不会修改原始数组，而 flatMap() 可能会根据映射函数的返回值改变数组内容和结构。

结论

flat() 和 flatMap() 都是处理嵌套数组的强大工具，但它们的用途和功能有所不同。选择使用哪一个取决于你的具体需求：如果只需要简单地扁平化数组，那么 flat() 就足够了；如果需要同时对数组元素进行操作并扁平化结果，那么 flatMap() 是更好的选择。