ES9 中的 flatMap() 和 flat() 方法在数组和多维数组中的运用

在 ES9 中，新增加了 flatMap() 和 flat() 两个方法，它们可以在数组和多维数组中进行操作，提高了数组的处理效率和代码的简洁性。

flat() 方法

flat() 方法可以将多维数组转换为一维数组，它可以接收一个参数，表示要展开的深度。如果不传参数，默认为 1。

示例代码：

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

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

flatMap() 方法

flatMap() 方法是在 map() 方法的基础上进行拓展，它可以对 map() 方法返回的数组进行一次 flat() 操作。

示例代码：

const arr = [1, 2, 3, 4];

const flatMapArr = arr.flatMap(item => [item * 2]);
// [2, 4, 6, 8]

数组运用

在实际开发中，我们经常会遇到需要对多维数组进行操作的情况，比如一个数组中嵌套了多个数组，我们需要将它们展开为一个一维数组。

使用 flat() 方法可以轻松实现：

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

多维数组运用

在多维数组中，我们可以使用 flat() 方法对数组进行展开操作，然后使用 map() 方法对每个元素进行操作，最后使用 flat() 方法将结果展开为一维数组。

示例代码：

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

const result = arr
  .flat()
  .map(item => item * 2)
  .flat();
// [2, 4, 6, 8, 10, 12]

总结

ES9 中的 flat() 和 flatMap() 方法为数组操作提供了更为便捷的方式，可以大大提高开发效率和代码简洁性。在实际开发中，我们可以根据实际情况灵活运用这两个方法，提高代码的可读性和可维护性。

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