如何利用 ECMAScript 2019 的 Array.prototype.flat 和 Array.prototype.flatMap 简化数组操作-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，操作数组是非常常见的需求。ECMAScript 2019 中新增了两个数组方法，Array.prototype.flat 和 Array.prototype.flatMap，可以帮助我们更加方便地进行数组操作。

Array.prototype.flat

Array.prototype.flat 可以将多维数组扁平化为一维数组。它接收一个参数，表示要扁平化的深度，默认为 1。

示例代码：

const arr = [1, [2, 3], [4, [5, 6]]];
const flatArr = arr.flat();
console.log(flatArr); // [1, 2, 3, 4, [5, 6]]

const deepFlatArr = arr.flat(2);
console.log(deepFlatArr); // [1, 2, 3, 4, 5, 6]

在上面的示例中，我们定义了一个多维数组 arr，并使用 flat 方法将其扁平化为一维数组 flatArr。我们还可以通过传递参数 2，将 arr 扁平化为深度为 2 的一维数组 deepFlatArr。

Array.prototype.flatMap

Array.prototype.flatMap 可以将一个数组映射成另一个数组，同时支持扁平化操作。它接收一个回调函数作为参数，该回调函数返回一个数组或者一个值。

示例代码：

const arr = [1, 2, 3];
const mappedArr = arr.flatMap(num => [num * 2]);
console.log(mappedArr); // [2, 4, 6]

在上面的示例中，我们定义了一个数组 arr，并使用 flatMap 方法将其映射为一个新的数组 mappedArr。回调函数中将每个元素乘以 2，返回一个数组。由于 flatMap 方法会自动将返回的数组扁平化，所以最终的结果是一个一维数组。

总结

使用 ECMAScript 2019 中的 Array.prototype.flat 和 Array.prototype.flatMap 可以帮助我们更加方便地进行数组操作。在实际开发中，我们可以结合这两个方法，实现更加复杂的数组操作。

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