數組扁平化的方法

小白的第一篇文章，或有許多不足之處，望諸大佬勿噴，多多指教。

在實現數組扁平化時，首先咱們要了解數組扁平化的概念。
何爲數組扁平化？數組扁平華是指講一個多維數組變成一維數組。例如

[1, 2, [3, 4, [5, 6, [7]]]]-- -> [1, 2, 3, 4, 5, 6, 7]

而咱們將如何如實現呢。話很少說，開擼
複製代碼

第一種方法 reduce()

reduce()是ES5中新引入的一個API，其具體的用法，筆者在這就不過多贅述了，整理出來又是一篇文章了，具體內容能夠參考一下MDN文檔。在本文中，筆者將藉助其「可以遍歷到數組中的每個元素，而且次遍歷均可以使用上次遍歷結果」的特性，實現數組扁平化的功能

function arr1(a) {
        return a.reduce((result, item) => {
            return result.concat(Array.isArray(item) ? arr1(item) : item);
        }, []);
    }
複製代碼

第二種方法 toString和split

toString() 方法能夠把一個邏輯值轉換爲字符串 split() 方法能夠把字符串分割爲字符串數組 這種方法主要思想是調用toString方法，將數組轉爲字符串，而後再用split分割還原爲數組

var arr = [1, 2, [3, 4, [5, 6, [7]]]]

arr.toString().split(",")
複製代碼

第三種方法 join和split

jion()方法經過特定的格式去拼接字符參數，須要傳參 返回新的字符串 split() 方法能夠把字符串分割爲字符串數組 跟上面的toString方法同樣，join方法能夠將數組轉換爲字符串

var arr = [1, 2, [3, 4, [5, 6, [7]]]]

arr.join(",").split(",")
複製代碼

第四種方法 遞歸

遍歷數組的每一項，若是是數組就繼續遍歷，若是不是就concat

var arr = [1, 2, [3, 4, [5, 6, [7]]]]
    function arr1(a) {
        var b = []
        a.map(
            function v(item) {
                function c(item) {
                    if (Array.isArray(item)) {
                        b = b.concat(arr1(item))
                    }
                    else {
                        b.push(item)
                    }
                }
                return c(item)
            }
        )
        return b
    }
複製代碼

第五種方法 擴展運算符

擴展運算符是ES6中新定義的，他能將二維數組變成一維

var arr = [1, 2, [3, 4, [5, 6, [7]]]]

var arr = [1, 2, [3, 4, [5, 6, [7]]]]
function flatten(a) {
    while (
        a.some(function b(item) {

            //some()是對數組中每一項運行給定函數，若是該函數對任一項返回true，則返回true。
            return Array.isArray(item)
        }
        )
    ) {
        a = [].concat(...a);
    }
    return a;
}
複製代碼

第六種方法 flat

flat是ES6中新定義的方法。flat() 方法會按照一個可指定的深度遞歸遍歷數組，並將全部元素與遍歷到的子數組中的元素合併爲一個新數組返回。

var arr = [1, [2, 3], [4, 5], [6, [7, 8], 9, [[[10, [[11, 12], 13], 14], 15, 16], 17], 18]]
    console.log(arr.flat(Infinity));
複製代碼

總的來講大思想只有一個，先遍歷數組，若是數組的元素也是數組就繼續遍歷，若是不是就concat

本文參考文章

5種方式實現數組扁平化 -——wind（博客園）

你應該知道的js：reduce的n種應用——AlexLee（掘金）

JS中的map()方法--微光刺眼丶（CSDN）

JS中every()和some()的用法 ——麋鹿傳（CSDN）複製代碼