JS中flat---提取嵌套數組元素

引言

對於前端項目開發過程當中，偶爾會出現層疊數據結構的數組，咱們須要將多層級數組轉化爲一級數組（即提取嵌套數組元素最終合併爲一個數組），使其內容合而且展開。那麼該如何去實現呢？

數組方法：flat

做用

flat()方法會按照一個可指定的深度遞歸遍歷數組，並將全部元素與便利到的子數組中的元素合併爲一個新數組返回。不考慮他所謂指定深度，直白一點來講，就是數組扁平化，也就是把一個有多層嵌套的數組，提取爲一個只有一層的數組。

語法

var newArray=arr.flat(depth)

參數

depth（可選參數）指定要提取嵌套數組的結構深度，默認值爲1

示例

var arr=['one','two','three',['red','green',[1,2,3],'blue']];
var result=arr.flat();
console.log(result);
複製代碼

上面也提到了，flat的默認參數是1，那麼這個參數究竟起到什麼做用呢？

從引言部分看到一個大概的解釋，「按照一個指定的深度遞歸遍歷數組」，這個參數depth就是所說的深度，也就是可以指定遍歷到多少層的層數，直接拿例子說話：

var arr=['red',[1,2,[3,4,[5,6,[7,8,[9,10],11,12]]]]];
console.log(arr.flat());
console.log(arr.flat(2));
console.log(arr.flat(3));
console.log(arr.flat(4));
console.log(arr.flat(Infinity));
複製代碼

嵌套的數組就像洋蔥同樣一層一層地剝開啦~ 用 Infinity做爲參數就直接剝光了！

數組扁平化即提取嵌套數組元素的其餘方法

需求： 多維數組->一維數組

let ary = [1, [2, [3, [4, 5]]], 6];

除了直接用flat，還有如下幾種方法

都是我目前理解不了的辦法，就先看看吧

方法一：

ary = str.replace(/(\[\]))/g, '').split(',');
複製代碼

方法二：

let ary = [1, [2, [3, [4, 5]]], 6];
let str = JSON.stringify(ary);
str = str.replace(/(\[\]))/g, '');
str = '[' + str + ']';
ary = JSON.parse(str);
複製代碼

方法三：

let result = [];
let fn = function(ary) {
for(let i = 0; i < ary.length; i++) }{
    let item = ary[i];
    if (Array.isArray(ary[i])){
         fn(item);
    }
    else {
        result.push(item);
    }
}
複製代碼

方法四：

while (ary.some(Array.isArray)) {
    ary = [].concat(...ary);
}
複製代碼

參考： JS數組扁平化