数组扁平化1

1.[1,2,3,[5,6],[3,4,8]].join(',')
"1,2,3,5,6,3,4,8"
"1,2,3,5,6,3,4,8".split(',')
(8) ["1", "2", "3", "5", "6", "3", "4", "8"]
4157201.htm:1 Unchecked runtime.lastError: The message port closed before a response was received.
2.[1,2,3,...[5,6],...[3,4,8]]
(8) [1, 2, 3, 5, 6, 3, 4, 8]

 

 

3.[].concat.apply([], [1,2,3,[5,6],[3,4,8]]);

4.

function flatten(arr) {  
    return arr.reduce((result, item)=> {
        return result.concat(Array.isArray(item) ? flatten(item) : item);
    }, []);
}

undefined
flatten([1,2,3,[5,6],[3,4,8]])
(8) [1, 2, 3, 5, 6, 3, 4, 8]

 

数组是 JS 中使用频率仅次于对象的数据结构，官方提供了众多的 API，谈谈如何扁平化（flatten）数组。

数组的扁平化，是将一个嵌套多层的数组 array (嵌套可以是任何层数)转换为只有一层的数组

flat

flat(depth) 方法会递归到指定深度将所有子数组连接，并返回一个新数组, depth指定嵌套数组中的结构深度，默认值为1，不管多少层则可以用Infinity关键字作为参数

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

2.  

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

4.  

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

6. 复制代码

flat()有兼容性问题， 不建议使用

reduce

1. function flatten(arr) {

2. return arr.reduce((a, b) => {

3. // return Array.isArray(b) ? a.concat(flatten(b)) : a.concat(b);

4. return a.concat(Array.isArray(b) ? flatten(b) : b);

5. }, []);

6. };

7.  

8. // es6

9. const flatten = arr =>

10. arr.reduce((a, b) => a.concat(Array.isArray(b) ? flatten(b) : b), []);

11.  
12.  

13. flatten([1,[2,3],4,[[5,6],7]]) // [1, 2, 3, 4, 5, 6, 7]

14. 复制代码

toString

只适于数组的元素都是数字

1. function flatten(arr) {

2. return arr.toString().split(",").map(item => +item);

3. };

4.  
5.  

6. flatten([1,[2,3],4,[[5,6],7]]) // [1, 2, 3, 4, 5, 6, 7]

7. 复制代码

[].concat(...arr)

1. function flatten(arr) {

2. return !Array.isArray(arr) ? arr : [].concat.apply([], arr.map(flatten));

3. }

4.  
5.  

6. flatten([1,[2,3],4,[[5,6],7]]) // [1, 2, 3, 4, 5, 6, 7]

7. 复制代码

generator

1. function* flatten(arr) {

2. if (!Array.isArray(arr)) yield arr;

3. else for (let el of arr) yield* flatten(el);

4. }

5.  

6. let flattened = [...flatten([1,[2,[3,[4]]]])]; // [1, 2, 3, 4]

7. 复制代码

字符串过滤

将输入数组转换为字符串并删除所有括号（[]）并将输出解析为数组

1. const flatten = arr => JSON.parse(`[${JSON.stringify(arr).replace(/\[|]/g,'')}]`);

2. 复制代码

undercore or lodash 库

使用undercore库或者lodash的中_.flatten函数，具体用法查阅API文档

1. _.flatten([1, [2], [3, [[4]]]]);

2. => [1, 2, 3, 4];

3. 复制代码

参考文献

实现扁平化（flatten）数组的方法还有很多种，可以参考一下文献

1. javascript-flattening-an-array-of-arrays-of-objects

2. merge-flatten-an-array-of-arrays-in-javascript

参考文章：https://www.cnblogs.com/wind-lanyan/p/9044130.html