在 ES10 中，新增了一个 flat() 方法，它可以将一个多维数组变成一个一维数组。这对于前端开发中处理数据的场景非常有用。本文将详细介绍 Array.flat() 的用法以及注意事项，并提供一些示例代码。
用法
Array.flat() 方法会遍历数组，对于每一个元素，如果其是一个数组，就将其中的元素取出来，并将其合并到新数组中。该方法具有一个可选参数 depth，用于指定需要拉平的数组层数。默认值为 1，表示只拉平一层数组。例如:
const arr = [1, 2, [3, 4]]; console.log(arr.flat()); // [1, 2, 3, 4] const arr2 = [1, [2, [3, [4]]]]; console.log(arr2.flat()); // [1, 2, [3, [4]]] console.log(arr2.flat(2)); // [1, 2, 3, [4]] console.log(arr2.flat(Infinity)); // [1, 2, 3, 4]
在第一个示例中，arr 是一个包含两个数字和一个数组的数组，我们使用 flat() 将其转换为一个一维数组。在第二个示例中，arr2 是一个包含多层嵌套数组的数组，我们使用 flat() 将其转换为一个二维数组和一个数字的数组。最后一个示例中，我们使用 flat() 将其完全展开成一个一维数组。由于我们不知道数组的层数，我们可以使用 Infinity 作为参数。
注意事项
当使用 flat() 方法时，应注意以下几点：
该方法会返回一个新的数组，原数组不会被修改。
如果数组中的某个元素是
null或undefined，则flat()方法会将其忽略掉。如果数组的某个元素不是数组，
flat()方法会将其视为一个只有一个元素的数组并合并进新数组中。如果
depth参数小于或等于 0，则flat()方法会返回原数组，而不会进行任何操作。如果
depth参数大于等于数组层数，则flat()方法会完全展开数组。flat()方法只会拉平一层数组，如果需要拉平多层数组，需要指定depth参数。flat()方法不会改变原数组的值，如果想改变原数组的值，可以使用Array.prototype.splice()或Array.prototype.push()。
示例代码
下面是一些使用 Array.flat() 方法的示例代码：
-- -------------------- ---- -------
-- ------
----- ---- - --- -- --- ----
----- ---- - --- -- --- ----
----- ---- - --- --- ---- -----
----- -------- - ------ ----- -------------
---------------------- -- --- -- -- -- -- -- -- -- -- --- --- ---
-- ---------
----- ---- - -
----- ----- -----
-------- ----------- --------- ---------
-------- -
- ----- ------ -------- ---------- ----------- --
- ----- ------- -------- ----------- ----------- -
-
--
----- ------- - -------------------------------------- -- ---------------------
--------------------- -- ------------ --------- --------- ---------- ------------ ----------- ------------在第一个示例中，我们本次合并了三个数组。在第二个示例中，我们拉平了一个嵌套的对象数组，并找到了其中所有的嵌套数组。这些示例说明了 Array.flat() 方法对于前端开发人员的实际应用价值。
总结
我们在本文中学习了 Array.flat() 方法的用法以及需要注意的事项。虽然该方法是一个新功能，但它已成为前端开发中不可或缺的一部分。我们希望您可以掌握该方法，并在实际开发中使用它。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65ae371dadd4f0e0ff7c4dc6