JavaScript学习-flat()方法扁平化数组

这是我参与11月更文挑战的第16天，活动详情查看：2021最后一次更文挑战

相关更文有学习 JavaScript 并不完美但是不影响其运行的一些神奇"small-bug":

JavaScript - 扁平化数组方法 flat()

数组Array.prototype.flat() 这个方法 简单来说就是扁平化数组(打散数组深层次为出入的层数(depth)).

flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。

下面通过一个JavaScript Demo: 来简单初步了解下Array.flat()的作用:

const arr1 = [0, 1, 2, [3, 4]];

console.log(arr1.flat());
// this output: [0, 1, 2, 3, 4]

const arr2 = [0, 1, 2, [[[3, 4]]]];

console.log(arr2.flat(2));
// this output: [0, 1, 2, [3, 4]]

flat() 使用语法:

let newArray = arr.flat([depth])

参数:

depth 可选

指定要提取嵌套数组的结构深度，默认值为 1。

返回值:

该方法会返回 一个包含将数组与子数组中所有元素的 新数组

flat() usage 使用:

1. 扁平化嵌套数组

var arr1 = [1, 2, [3, 4]];
arr1.flat();
// [1, 2, 3, 4]

var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]

//使用 Infinity，可展开任意深度的嵌套数组
var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

2. 扁平化与数组空项

flat() 方法会移除数组中的空项:

var arr5 = [1, 2, , 4, 5];
arr5.flat();
// [1, 2, 4, 5]

flat() 方法使用注意事项

1. 在不传参数的情况下, flat() 方法只会"打平一级嵌套", 即原始数组中嵌套的数组会被打平, 而如果打平后的这部分数组元素仍包含数组, 则不会再继续打平了.

2. flat()方法默认为1, 如果想对数组进行打平更多层级, 需要给flat方法传递一个参数(数值), 为想要打平的层级数

3. 如果想更省劲, 直接传一个 infinity关键字, 可以打平任意层级嵌套的数组