Array.prototype.flat()

flat()方法會按照一個可指定的深度遞歸遍歷數組，并將所有元素與遍歷到的子數組中的元素合并為一個新數組返回。

const arr1 = [0, 1, 2, [3, 4]]; console.log(arr1.flat()); // [0, 1, 2, 3, 4]const arr2 = [0, 1, 2, [[[3, 4]]]]; console.log(arr2.flat(2)); // [0, 1, 2, [3, 4]]

語法：var newArray = arr.flat([depth])

• depth 可選參數，默認是1，如果想全部扁平可以傳Infinity

var arr1 = [1, 2, [3, 4]]; arr1.flat(); // [1, 2, 3, 4]var arr2 = [1, 2, [3, 4, [5, 6]]]; arr2.flat(); // [1, 2, 3, 4, [5, 6]]var arr3 = [1, 2, [3, 4, [5, 6]]]; arr3.flat(2); // [1, 2, 3, 4, 5, 6]//使用 Infinity，可展開任意深度的嵌套數組 var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]]; arr4.flat(Infinity); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

flat()方法會移除數組中的空項:

var arr4 = [1, 2, , 4, 5]; console.log(arr4.flat()); // [1, 2, 4, 5]

Array.prototype.flatMap()

flatMap() 方法首先使用映射函數映射每個元素，然后將結果壓縮成一個新數組。它與 map 連著深度值為1的flat幾乎相同，但flatMap通常在合并成一種方法的效率稍微高一些。

語法：

var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {// return element for new_array }[, thisArg])

• currentValue 當前正在數組中處理的元素
• index 可選的。數組中正在處理的當前元素的索引。
• array 可選的。被調用的 map 數組
• thisArg 可選的。執行 callback 函數時 使用的this 值。

var arr1 = [1, 2, 3, 4];arr1.map(x => [x * 2]); // [[2], [4], [6], [8]]arr1.flatMap(x => [x * 2]); // [2, 4, 6, 8]// only one level is flattened arr1.flatMap(x => [[x * 2]]); // [[2], [4], [6], [8]]

場景：將幾句話的數組拆分成單詞數組

let arr1 = ["it's Sunny in", "", "California"];arr1.map(x => x.split(" ")); // [["it's","Sunny","in"],[""],["California"]]arr1.flatMap(x => x.split(" ")); // ["it's","Sunny","in", "", "California"] 創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的【ES10(2019)】Array扩展 flat / flatMap的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。