网站建设高清图片微网站素材

数组的成员有时还是数组，Array.prototype.flat()用于将嵌套的数组“拉平”，变成一维的数组。该方法返回一个新数组，对原数据没有影响。

[1, 2, [3, 4]].flat()
// [1, 2, 3, 4]

那flat怎么来实现呢？

1、使用while循环

实现的代码如下：

        // 实现数组中的flat拉平函数let arr = [20, [6, 7, 8], [2, [9, 10]], 17]const flatten = function (arr) {while (arr.some(v => Array.isArray(v))) {arr = [].concat(...arr)}return arr;}console.log(flatten(arr)) // [20, 6, 7, 8, 2, 9, 10, 17]

2、使用数组中的map方法

        // 实现数组中的flat拉平函数let arr = [20, [6, 7, 8], [2, [9, 10]], 17]const flatten = function (arr) {return [].concat(...arr.map(v => Array.isArray(v) ? flatten(v) : v))}console.log(flatten(arr)) // [20, 6, 7, 8, 2, 9, 10, 17]

关于第二种方法的理解 最后的是

[].concat(...[20, [6, 7, 8], [2, 9, 10], 17]) // [20, 6, 7, 8, 2, 9, 10, 17]

扩展运算符会展开数组，相当于拉平一级。
concat方法合并数组，是往新数组中添加的数组成员，例如，[].concat(…[20, [6, 7, 8]])相当于[].concat(20, [6, 7, 8])，往[]这个空数组中添加的是数字20和[6, 7, 8]这个数组的成员6、7、8，所以[].concat(…[20, [6, 7, 8]])就相当于拉平了数组。

在用第二种方法时，我刚开始是有些不理解的，不过我推理了一下，确实是对的，其中的关键点在于递归调用、concat方法和扩展运算符的应用。

最后，我们看一下concat的用法，
concat()方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。
注意：合并的时候，添加的是数组成员，一定要谨记，如果不是数组，也当做成员，一起添加到新数组中。

let arr1 = [1,2,3];
let arr2 = [4,5,6];
let arr3 = [7,8,9];
let num = 10;console.log(arr1.concat(arr2,arr3,num)); // [1,2,3,4,5,6,7,8,9,10]

我们再看一下这个例子：

let arr1 = [1,[2,3]];
let num = 10;console.log([].concat(arr1,num)); // [1,[2,3],10]console.log([].concat(...arr1,num)); // [1,2,3,10] 

可以看到因为使用了扩展运算符，所以最后打印的结果是不一样的。