利用 ES9 中的数组 flatten() 处理二维数组
在前端开发中，我们常常会遇到需要将嵌套的二维数组转化为一维数组的情况。以前需要我们手动通过递归的方式来处理，但是在 ES9 中，新增了一个名为 flatten() 的方法，可以轻松地将嵌套的二维数组转化为一维数组。
flatten() 方法可以将多维嵌套数组展开并返回一个新的一维数组。该方法可以接受一个可选的参数，表示展开的深度。默认值为 1。
以下是 flatten() 方法的基本语法：
array.flatten([depth]);
其中，array 表示要展开的数组，depth 表示展开的深度。如果不传入该参数，则默认为 1，即只展开数组内的直接子元素。
示例代码如下：
const arr = [1, [2, [3, 4]]]; const flattenArr = arr.flatten(); console.log(flattenArr); // [1, 2, [3, 4]] const flattenArr2 = arr.flatten(Infinity); console.log(flattenArr2); // [1, 2, 3, 4]
在上述代码中，原数组 arr 是一个嵌套了两层的数组，通过调用 flatten() 方法，可以将其展开为一维数组。当不传入 depth 参数时，只有第一层被展开，返回的结果中仍有一个嵌套的二维数组。当传入 depth 参数为 Infinity 时，则会无限制展开所有子元素。
除了数组内部嵌套的情况，我们还可以利用 flatten() 方法处理多个数组的嵌套。以下是一个示例：
const arr1 = [1, 2]; const arr2 = [3, [4, [5, 6]]]; const arr3 = [7, [8, 9], 10]; const arr4 = [11]; const flattenArr = [arr1, arr2, arr3, arr4].flatten(2); console.log(flattenArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]
在上述代码中，我们将四个数组合并为一个数组，并传入了 depth 参数为 2。由于需要展开两层，所以上述代码中的 arr2、arr3 数组都被完全展开为一维数组，并且其中的嵌套元素也被展开。
总结
利用 ES9 中的数组 flatten() 方法，可以轻松地将嵌套的二维数组转化为一维数组，无需手动递归处理。需要注意的是，该方法可以接受一个可选的参数 depth，用于指定要展开的深度。默认为 1。掌握这个数组方法可以在开发过程中提高我们的效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6492a68248841e9894071770