随着前端技术的快速发展，新的 ECMAScript 规范也源源不断地推出。其中，ECMAScript 2016（ES7） 新增了 Array.flat() 和 Array.flatMap() 两个方法，这两个方法使得 JavaScript 数组的操作更加便捷。本文将详细介绍这两个方法的用法及其在实际开发中的应用。
Array.flat() 方法
Array.flat() 方法用来将嵌套的数组展开为一维数组。它的语法如下：
array.flat([depth])
其中，array 为需要展开的数组，depth 为减少的嵌套层数（默认值为 1）。当 depth 参数为 Infinity 时，将递归完全展开嵌套的数组。
下面是一个简单的示例：
-- -------------------- ---- ------- ----- ---- - --- -- --- ---- ------------------------- -- --- -- -- -- ----- ---- - --- -- --- -- --- ----- ------------------------- -- --- -- -- -- --- --- ----- ---- - --- -- --- -- --- ----- -------------------------- -- --- -- -- -- -- -- ----- ---- - --- -- --- -- --- ----- --------------------------------- -- --- -- -- -- -- --
这个示例中，我们使用了不同层数的数组，并通过不同的 depth 参数来实现不同的展开效果。
Array.flatMap() 方法
Array.flatMap() 方法用来对数组进行映射和展开。它的语法如下：
array.flatMap(callback[, thisArg])
其中，array 为需要展开的数组，callback 为每个元素要执行的函数，返回值可以是一个数组，thisArg 为函数内 this 的值（可选）。
下面是一个简单的示例：
const arr1 = [1, 2, 3]; const arr2 = arr1.flatMap(x => [x * 2]); console.log(arr2); // [2, 4, 6]
这个示例中，我们将原数组每个元素都乘以 2，并将结果展开为一维数组。可以看到，通过 flatMap() 方法，我们可以使用一种更简洁的代码方式实现这个操作。
结束语
Array.flat() 和 Array.flatMap() 方法是 ECMAScript 2016（ES7）中新增的两个方法，它们大大简化了 JavaScript 数组的操作。在实际开发中，我们可以将它们用于多种场景，如数据清洗、数据展示等。希望本文对大家理解和应用这两个方法有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6781fd7c935627c900f294e5
