在 ES8 中，JavaScript 新增了一些方便开发者处理数据的方法。其中，Array.flat() 和 Array.flatMap() 是两个与数组有关的方法。本文将详细介绍这两个方法，包括使用场景、实际用例以及示例代码。
Array.flat()
Array.flat() 方法用于将嵌套的数组扁平化至指定的深度。其语法为：
arr.flat([depth])
其中，arr 表示要扁平化的数组，depth 表示扁平化的深度，默认为 1。如果要完全扁平化数组，depth 值应该设为 Infinity。
具体示例如下：
const arr = [1, 2, [3, 4, [5, 6]]]; const flatArr = arr.flat(2); console.log(flatArr); // [1, 2, 3, 4, 5, 6]
上述代码中，arr 数组是一个嵌套数组，其内部包含了两层嵌套。通过调用 flat() 方法并将 depth 值设为 2，我们将 arr 数组扁平化了两次，最终得到了一个完全扁平化的数组。
需要注意的是，flat() 方法会将数组中的 null、undefined、空元素数组 移除，并返回新的数组。
const arr2 = [1, 2, , 4, [5, 6, []]]; const flatArr2 = arr2.flat(); console.log(flatArr2); // [1, 2, 4, 5, 6]
上述代码中，原数组 arr2 包含了一个 空元素数组。使用 flat() 方法将其扁平化后，空元素数组被移除，返回了一个新的数组。
Array.flatMap()
Array.flatMap() 方法用于将数组映射为另一个数组，并对返回的数组进行扁平化。其语法为：
arr.flatMap(callback(currentValue[, index[, array]])[, thisArg])
其中，arr 表示要映射的数组，callback 表示要对数组的每个元素进行的操作，返回一个新数组。这个新数组将被自动扁平化。thisArg 表示在 callback 函数中可用的对象。
具体示例如下：
const arr = [1, 2, 3, 4]; const result = arr.flatMap((item) => [item * 2]); console.log(result); // [2, 4, 6, 8]
上述代码中，arr 数组中的每个元素都被乘以 2，返回一个新的数组。然而，由于 flatMap() 方法自动将新数组扁平化，因此不需要额外的使用 flat() 方法。
需要注意的是，flatMap() 方法的使用场景与 map() 和 flat() 方法的组合类似。因此，在处理数组数据时，可以选择使用 flatMap() 方法来简化代码。
总结
本文介绍了 ES8 中新增的两个对数组操作功能的方法：Array.flat() 和 Array.flatMap()。它们各自的使用场景和实用性使我们在处理数组数据时变得更加灵活和高效。对于 JavaScript 开发者来说，了解这些方法是必要的，以便在日常代码中使用它们，从而提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64a0e72148841e9894d2c405
