随着前端技术的不断发展，ECMAScript 也在不断更新，为我们带来了更多更强大的功能。其中，ECMAScript 2017 中新增的 flat 和 flatMap 函数，为数组的操作提供了更加方便和高效的方式。本文将详细介绍这两个函数的用法和指导意义。
flat 函数
flat 函数用于将多维数组转换为一维数组。它可以接受一个参数，用于指定要展开的层数。如果不传参数，默认展开一层。
下面是一个简单的示例：
const arr = [1, 2, [3, 4]]; const flatArr = arr.flat(); console.log(flatArr); // [1, 2, 3, 4]
在这个示例中，原数组 arr 包含两个元素，其中第二个元素是一个数组。调用 flat 函数后，这个数组被展开成了一维数组。
如果原数组中有多个嵌套的数组，可以传递一个数字作为参数，指定要展开的层数。例如：
const arr = [1, 2, [3, [4, 5]]]; const flatArr = arr.flat(2); console.log(flatArr); // [1, 2, 3, 4, 5]
在这个示例中，原数组 arr 包含两个嵌套的数组。调用 flat 函数并传递参数 2，表示要展开两层。最终得到的一维数组包含了原数组中的所有元素。
需要注意的是，如果原数组中有空位（即某个位置没有任何值），flat 函数会将其删除。例如：
const arr = [1, 2, , 3, 4]; const flatArr = arr.flat(); console.log(flatArr); // [1, 2, 3, 4]
在这个示例中，原数组 arr 中有一个空位。调用 flat 函数后，空位被删除，最终得到的一维数组不包含空位。
flatMap 函数
flatMap 函数是 flat 函数的一种变体，它不仅可以将多维数组转换为一维数组，还可以对每个元素进行转换。
flatMap 函数接受一个函数作为参数，该函数会被应用到原数组中的每个元素，返回一个新的数组。然后，flatMap 函数会将所有返回的数组展开成一维数组。
下面是一个简单的示例：
const arr = [1, 2, 3]; const flatMapArr = arr.flatMap(x => [x, x * 2]); console.log(flatMapArr); // [1, 2, 2, 4, 3, 6]
在这个示例中，原数组 arr 包含三个元素。调用 flatMap 函数并传递一个函数作为参数，该函数将每个元素转换为包含两个元素的数组。最终得到的一维数组包含了所有转换后的元素。
需要注意的是，flatMap 函数会先执行传入的函数，再执行 flat 函数。因此，传入的函数返回的数组中也可以包含多维数组，这些数组会被展开成一维数组。例如：
const arr = [1, 2, 3]; const flatMapArr = arr.flatMap(x => [[x, x * 2]]); console.log(flatMapArr); // [[1, 2], [2, 4], [3, 6]]
在这个示例中，传入的函数返回的是一个包含两个元素的数组，该数组又被包装在一个数组中。最终得到的数组是一个二维数组，而不是一维数组。如果希望得到一维数组，可以在传入的函数中再调用一次 flat 函数，例如：
const arr = [1, 2, 3]; const flatMapArr = arr.flatMap(x => [[x, x * 2]].flat()); console.log(flatMapArr); // [1, 2, 2, 4, 3, 6]
指导意义
flat 和 flatMap 函数可以大大简化数组的操作，特别是在处理多维数组时。它们可以让我们更加方便地将多维数组转换为一维数组，并且可以对每个元素进行转换。
在实际开发中，我们经常需要对数组进行操作，例如过滤、映射、排序等。使用 flat 和 flatMap 函数可以让我们更加高效地完成这些操作，避免写出冗长和难以维护的代码。
同时，需要注意的是，这两个函数在一些老版本的浏览器中可能不被支持。如果需要在这些浏览器中使用，可以考虑使用 polyfill 或者其他替代方案。
结论
ECMAScript 2017 中的 flat 和 flatMap 函数为数组的操作提供了更加方便和高效的方式。它们可以让我们更加方便地将多维数组转换为一维数组，并且可以对每个元素进行转换。在实际开发中，我们可以利用这些函数简化数组的操作，提高代码的可读性和维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/673be78939d6d08e88b5cd66
