ES7 带来的 Array.prototype.flat 方法，让你更容易操作多维数组

ES7 带来的 Array.prototype.flat 方法，让你更容易操作多维数组

在编写前端代码时，操作多维数组是非常常见的需求。以前需要使用递归或者循环来进行操作，这样会让代码变得复杂且难以维护。ES7 带来了一个新的 Array.prototype.flat 方法，可以让我们更轻松地操作多维数组。

Array.prototype.flat 方法是一个从数组中移除所有嵌套数组的方法。我们可以通过该方法将一个多维数组变成一个一维数组。该方法的使用非常简单，只需要在数组对象上调用 flat 方法即可：

const nestedArray = [[1, 2], [3, 4, [5, 6]]];

const flattenedArray = nestedArray.flat();

console.log(flattenedArray); // [1, 2, 3, 4, 5, 6]

在这个例子中，我们首先定义了一个嵌套数组。然后我们调用了 flat 方法来移除它的嵌套结构，并将结果存储在一个变量中。最后，我们使用 console.log() 来打印出结果。

此外，flat() 方法也可以接收一个参数，它指定要移除的数组级别的深度。我们可以传一个数字 n 来告诉 flat() 方法只移除 n 级的嵌套数组。例如：

const nestedArray = [[[1, 2], [3, 4]], [[5, 6], [7, 8]]];

const flattenedArray = nestedArray.flat(2);

console.log(flattenedArray); // [1, 2, 3, 4, 5, 6, 7, 8]

在这个例子中，我们定义了一个三层嵌套的数组，并将参数 2 传递给 flat() 方法。这样，只有两层的嵌套数组被移除，结果是一维数组 [1, 2, 3, 4, 5, 6, 7, 8]。

除了用来移除嵌套数组外，flat() 方法还可以用来过滤掉一个多维数组中的 null、undefined、0 等“假值”。比如：

const nestedArray = [1, [2, null], [], [undefined, 3, 0]];

const flattenedArray = nestedArray.flat().filter(Boolean);

console.log(flattenedArray); // [1, 2, 3]

在这个例子中，我们首先定义了一个包含各种“假值”的嵌套数组。然后我们使用 flat() 方法将其转换为一维数组，并使用 filter() 方法过滤掉“假值”。最终结果是 [1, 2, 3]。

总结

在这篇文章中，我们介绍了 ES7 引入的 Array.prototype.flat() 方法，该方法可以方便地操作多维数组，避免代码变得复杂和难以维护。我们也看到了该方法的一些使用实例，包括转换嵌套数组为一维数组、移除指定的嵌套深度、过滤掉数组中的“假值”等。在编写前端代码时，该方法会是一个很好的工具和技巧，值得我们深入学习和实践。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c896915ad90b6d04141ab1