在 JavaScript 中，数组是一种常见的数据类型，我们经常需要对数组进行操作。ES6 中引入了 Array.prototype.flat() 方法，用于将多维数组转换为一维数组。而 ES12 版本新增了 Array.prototype.flatMap() 方法，可以在一定程度上替代 flat() 方法，同时也有一些独特的功能。
flatMap() 方法的基本用法
Array.prototype.flatMap() 方法的作用是将数组中的每个元素进行一些处理后，再将处理结果合并成一个新数组。它与 Array.prototype.map() 方法的区别在于，flatMap() 方法会将处理结果扁平化，也就是将返回的数组展开一层。
flatMap() 方法的语法如下：
------------------------------------- ------- ---------- ---------
参数说明：
- callback：对数组中的每个元素执行的函数，函数返回一个数组，这些数组会被合并成一个新数组。
- currentValue：当前正在处理的元素。
- index（可选）：当前正在处理的元素的索引。
- array（可选）：当前正在处理的数组。
- thisArg（可选）：执行 callback 函数时使用的 this 值。
下面是一个简单的示例，使用 map() 方法将数组中的每个元素转换为一个新数组，再使用 flat() 方法将这些新数组展开：
----- --- - --- -- --- ----- ------ - --------- -- -- - ----------- -------------------- -- --- -- --
使用 flatMap() 方法可以将这个操作合并为一步：
----- --- - --- -- --- ----- ------ - ------------- -- -- - ---- -------------------- -- --- -- --
flatMap() 方法的特殊用法
除了上述基本用法，flatMap() 方法还有一些特殊的用法。
1. 删除数组中的某些元素
我们可以使用 flatMap() 方法来删除数组中的某些元素。只需要在回调函数中返回一个空数组即可，这样这些元素就会被删除。
----- --- - --- -- -- -- --- ----- ------ - ------------- -- - - - --- - - -- - --- -------------------- -- --- -- --
2. 将数组展开到指定深度
与 flat() 方法类似，flatMap() 方法也可以展开多维数组。我们可以通过回调函数的参数 index 来控制展开的深度。
----- --- - --- --- --- ------- ----- ------ - --------------- ------ -- ----- --- - - - - ---------- -------------------- -- --- -- --- -----
3. 将数组展开到任意深度
如果我们想要将数组展开到任意深度，可以使用递归实现。
----- --- - --- --- --- ------- ----- -------- - --- -- ------------- -- ---------------- - ----------- - --- ----- ------ - -------------- -------------------- -- --- -- -- --
总结
Array.prototype.flatMap() 方法是 ES12 中的新特性，它可以在一定程度上替代 flat() 方法，同时还有一些独特的功能。使用 flatMap() 方法可以使代码更加简洁和易读，同时也可以提高代码的性能。但是需要注意的是，flatMap() 方法可能会引发一些意想不到的问题，需要谨慎使用。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65f925ebd10417a2224eb2b5