在 ES10 中，新增了两个 Array 原型方法：Array.prototype.flat() 和 Array.prototype.flatMap()。这两个方法都是用来处理 JavaScript 数组的，但是它们的作用不同。在本文中，我们将深入探讨这两个方法的区别。
Array.prototype.flat()
Array.prototype.flat() 方法用于将嵌套的数组“展平”，即将多维数组转换为一维数组。它接受一个可选参数，表示要展平的嵌套层数。如果不传入参数，则默认展平一层。
下面是一个示例代码：
const arr = [1, 2, [3, 4, [5, 6]]]; const flatArr = arr.flat(); console.log(flatArr); // [1, 2, 3, 4, [5, 6]] const flatArr2 = arr.flat(2); console.log(flatArr2); // [1, 2, 3, 4, 5, 6]
在上面的例子中，我们有一个嵌套的数组 arr。调用 flat() 方法后，它将展平一层，得到一个新的数组 flatArr。如果我们传入参数 2，则它将展平两层，得到一个新的数组 flatArr2。
需要注意的是，flat() 方法只会展平数组中的元素，不会修改原数组。
Array.prototype.flatMap()
Array.prototype.flatMap() 方法是 ES10 新增的方法，它的作用与 Array.prototype.map() 方法类似，但是它会将返回的数组“展平”一层。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() 方法将这个数组“展平”一层，得到一个新的数组 flatMapArr。
需要注意的是，flatMap() 方法只会展平一层，如果回调函数返回的是一个多维数组，它将不会展平。
区别
Array.prototype.flat() 方法用于将多维数组转换为一维数组，而 Array.prototype.flatMap() 方法用于将数组“展平”一层。它们的作用不同，但是它们都可以用来简化数组操作。
在使用这两个方法时，需要注意它们的参数和返回值。Array.prototype.flat() 方法接受一个可选参数，用于指定要展平的嵌套层数，返回一个新的一维数组。而 Array.prototype.flatMap() 方法接受一个回调函数作为参数，该回调函数返回一个数组，返回一个新的“展平”了一层的数组。
结论
在实际开发中，我们可以根据需要选择使用 Array.prototype.flat() 方法或 Array.prototype.flatMap() 方法。如果需要将多维数组转换为一维数组，则可以使用 flat() 方法。如果需要对数组中的每个元素进行操作，并将它们“展平”一层，则可以使用 flatMap() 方法。无论使用哪种方法，都可以简化数组操作，提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/676bcf7778388e33bb28095f
