ES7 中的 Array.prototype.flat 和 flatMap 方法的区别
在 ES7 中，JavaScript 引入了两个新的数组方法：Array.prototype.flat 和 Array.prototype.flatMap。这两个方法都是用于数组的操作，但是它们有着不同的功能和区别。在本文中，我们将会详细介绍这两个方法，并说明它们之间的区别。
- Array.prototype.flat 方法
Array.prototype.flat 方法是构造一个新数组，通过将子数组中的所有子数组平铺到指定的深度来降低数组的嵌套程度。
语法：
array.flat([depth])
参数：
depth：指定要执行的平铺深度，默认值为 1。
例子：
const arr1 = [1, 2, [3, 4]]; arr1.flat(); // [1, 2, 3, 4] const arr2 = [1, 2, [3, [4, 5]]]; arr2.flat(2); // [1, 2, 3, 4, 5]
- Array.prototype.flatMap 方法
Array.prototype.flatMap 方法是对数组中的每个元素执行一个 map 方法，然后将结果扁平化为一个新数组。flatMap 实际上是一种组合了 map 和 flat 的方法。
语法：
array.flatMap(callbackFunction)
参数：
callbackFunction：当前数组中每个元素所调用的函数。该函数可以返回一个数组，该数组将被展开，最终包括在返回的扁平数组中。
例子：
const arr1 = [1, 2, 3, 4]; arr1.flatMap(x => [x * 2]); // [2, 4, 6, 8] const arr2 = [1, 2, 3, 4]; arr2.flatMap(x => [[x * 2]]); // [[2], [4], [6], [8]]
区别：
Array.prototype.flat 和 Array.prototype.flatMap 方法之间的主要区别是：
- flat 方法是将一个多维数组转换为一个一维数组，而 flatMap 方法则是在处理每个元素之前先将其映射为一个数组，并返回一个新数组。
- flatMap 方法还可以用于将映射后的数组扁平化。
指导意义：
Array.prototype.flat 和 Array.prototype.flatMap 方法可以使开发者更方便地操作数组。开发者可以使嵌套的数组变得扁平化，以简化代码。在实现一些对数组的复杂操作时，两个方法可以帮助开发者提高代码的简洁性和可读性。
总结：
通过本文，我们可以学习到 ES7 中的 Array.prototype.flat 和 flatMap 方法的使用方法和区别。并且可以明确两个方法在实际中的应用场景，这对于开发者更好的使用两个方法具有指导意义。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64abaff848841e9894780c6d