详解 ES7 中的 Array.prototype.flat 和 Array.prototype.flatMap 方法-JavaScript中文网-JavaScript教程资源分享门户

ES7 (ECMAScript 2016) 引入了两个新的数组方法：Array.prototype.flat()和Array.prototype.flatMap()。这两个方法可以提高代码的简洁性和可读性，特别是在处理嵌套的数组时尤为方便。

Array.prototype.flat()

Array.prototype.flat() 方法用于将嵌套的数组“展平”，即将多维数组转换为一维数组。

arr.flat([depth])

arr：要展平的数组。 depth：指定展平的深度，默认值为1。

const arr = [1,[2,3],[[4],[5]]];
const flattenedArr = arr.flat(2);

console.log(flattenedArr); // [1, 2, 3, 4, 5]

本例中，arr包含多层嵌套的数组。我们使用flat()方法展平该数组，并将深度参数设置为2。结果是一个一维数组 [1, 2, 3, 4, 5]。

Array.prototype.flatMap() 方法是map()和flat()两个方法的结合体，它首先对数组进行映射操作，然后再将结果展平成一个新的数组。

arr.flatMap(callback[, thisArg])

callback: 对数组每个元素进行操作的函数，它返回一个新的一维数组来替换当前元素。该函数接受三个参数：currentValue, index, 和array。

thisArg: 传入callback函数中的this值。

const arr = [1,2,3];
const result = arr.flatMap(x => [x, x * 2]);

console.log(result); // [1,2,2,4,3,6]

本例中，arr 是一个普通的数组。我们使用flatMap()方法来第一次让数组具有映射（map）的功能，它使每个元素扩展成一个由两个元素组成的新数组，并将这些子数组展平成一个新的一维数组。

Array.prototype.flat()和Array.prototype.flatMap()是ES7新增的两个数组方法，它们在处理嵌套数组时非常有用。通过展平多层嵌套的数组或进行映射操作，我们可以很容易地转换数组结构。您还可以设置深度参数以控制所需的展平级别。

当您需要处理复杂的数据结构时，尤其是在编写现代 JavaScript 的前端项目时，这两个方法将大大提高您的代码可读性和优雅性。

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