js 將巢狀陣列展平的方法一覽

陣列中可以巢狀陣列，要巢狀多少層都可以，比如[1, 2, [[3], 4]]
這樣看起來很不爽，所以我們要把它展開，只留下一層陣列: [1, 2, 3, 4]

結果：

flatten([1, 2, 3])                // [1, 2, 3]
flatten([1, 2, [3]])              // [1, 2, 3]
flatten([1, 2, [[3], 4]])         // [1, 2, 3, 4]
flatten([1, [2, [[3], [4]]]])     // [1, 2, 3, 4]

方法一：普通方法

function flattenMd(arr){
    var result=[]
    function flatten(arr){
        for (var i = 0; i 

並沒有什麼好說的

方法二：陣列concat方法

傳遞給concat方法的引數序列中如果包含陣列，則會將這個陣列的每一項新增到結果陣列中，這就使陣列的這個方法具有了天然的展開二維陣列的能力

function flatten2d(arr) {
    var result = [];
    for(var i = 0; i 

上面的方法還可以進一步簡化。我們知道apply方法是可以直接接受陣列引數，這樣我們連迴圈迭代都省了。

function flatten2d(arr) {
    return Array.prototype.concat.apply([], arr);
    // return [].concat.apply([],arr);
}

但是上述方法只能降低一維。因此我們需要使用迭代：

function flattenMd(arr) {
    var result = [];
    for(var i = 0; i 

還可以使用遞迴

function flatten(arr) {
  return arr.reduce(function (plane, toBeFlatten) {
    return plane.concat(Array.isArray(toBeFlatten) ? flatten(toBeFlatten) : toBeFlatten);
}, []);
}

遞迴的簡化版

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

再簡化

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

方法三：利用ES6的展開符

function flatten(arr) {
  return [].concat(...arr)
}

但是隻能降低一維 因此使用遞迴

function deepFlatten(arr) {
    flatten = (arr)=> [].concat(...arr);
    return flatten(arr.map(x=>Array.isArray(x)? deepFlatten(x): x));
}

方法四：陣列join和split方法的結合（只適用於數字陣列）

function flattenMd(arr) {
   return arr.join().split(',');   
}
var arr=['1', [null, 3, [4, 5], {K:1}], undefined, 8]
console.log(flattenMd(arr));//[ '1', '', '3', '4', '5', '[object Object]', '', '8' ]

缺陷：

• 所有型別的元素都會變成字串
• null、undefined會變成空字串、物件會變成[object Object]