Array.flat() 用法小结

Array.flat() 是 JavaScript 新增的一项数组方法，用于将多维数组展开为一维数组。本文将介绍这个方法的用法和一些实战技巧，以帮助读者更好地运用这一方法提高前端开发效率。

基本用法

下面是 Array.flat() 的基本用法示例：

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

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

在上面的示例中，我们有一个多维数组 arr，其中包含了一些嵌套的数组。通过调用 flat() 方法，我们将这个多维数组展开成了一个一维数组。

可以看到，flat() 方法对传入的数组进行了递归遍历，将所有嵌套的数组都展开了。如果不希望递归展开，可以传入一个数字作为参数，指定要展开的层数。

例如，flat(1) 只会将数组中的一级子数组展开成一维数组，而不会将更深的嵌套数组展开。

实战技巧

去除数组中的空项

Array.flat() 可以用于去除数组中的空项。例如，我们有一个数组，里面有一些空数组项，可以通过调用 flat() 方法将它们移除：

const arr = [1, [], 2, [3, 4], [[]], null];
const flatArr = arr.flat().filter(item => item !== null);

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

平铺带有深度的多维数组

有时候我们需要将多维数组只展开一层，但是需要保留嵌套数组内的元素。例如：

const arr = [1, [2, [3, [4]]]];
const flatArr = arr.flat();

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

如果希望将 arr 中的嵌套数组也展开，但只展开一层，可以传入 flat() 方法的参数：

const arr = [1, [2, [3, [4]]]];
const flatArr = arr.flat(2);

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

如上所示，传入数字 2，flat() 方法将展开两层嵌套的数组，得到我们期望的结果。

总结

Array.flat() 方法可以快速将多维数组展开为一维数组，使用起来非常方便，而且可以通过传入参数实现不同的展开深度。在实际开发中，还有其他诸如去除空项、平铺带有深度的多维数组等使用场景，读者可以根据具体需求进行调用。

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