ES9 中新增的数组方法 ——Array.flat() 和 Array.flatMap() 的使用

在 ES9 中，新增了两个数组方法，他们是 Array.flat() 和 Array.flatMap()。这两个方法非常有用，可以方便我们快速进行数组的整理和操作。

Array.flat()方法

Array.flat()方法可以将多维数组扁平化，返回一个一维数组。

它接受一个可选参数depth，depth默认值为1。depth为正整数时，表示返回数组的维度。如果depth小于等于0，则返回原数组。

以下是一些使用Array.flat()方法的示例：

示例1

const arr = [1, 2, [3, 4]];
const newArr = arr.flat(); 
// 输出：[1, 2, 3, 4]

示例 2

const arr = [1, 2, [3, [ 4, 5]]];
const newArr = arr.flat(); 
// 输出：[1, 2, 3, [ 4, 5]]

示例 3

const arr = [1, 2, [3, [ 4, 5]]];
const newArr = arr.flat(2); 
// 输出：[1, 2, 3, 4, 5]

示例 4

const arr = [1, 2, [3, [ 4, 5]]];
const newArr = arr.flat(Infinity); 
// 输出：[1, 2, 3, 4, 5]

Array.flatMap()方法

Array.flatMap()方法与Array.map()方法类似，但是能够“拍平”每个元素的返回值，并返回一个新的数组。

flatMap() 方法首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。

以下是一些使用Array.flatMap()的示例：

示例 1

const arr = [1, 2, 3];
const newArr = arr.flatMap(x => [x, x+10]); 
// 输出：[1, 11, 2, 12, 3, 13]

示例 2

const arr = [1, 2, 3];
const newArr = arr.flatMap(x => x%2 === 0 ? [] : [x, x+1]);
// 输出：[1, 2, 3]

总结

使用 Array.flat() 和 Array.flatMap() 方法可以使数组操作变得更加方便和高效。但是这两个方法是 ES9 中新增的，对于不支持ES9的浏览器或者Node.js版本，要使用 Babel 等工具进行转换。

参考链接

Array.prototype.flat()

Array.prototype.flatMap()

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6543566d7d4982a6ebd08d2c