如何實(shí)現(xiàn)一個(gè) flatMap 函數(shù) ?

基礎(chǔ)學(xué)習(xí):JavaScript(ES6)扁平化嵌套方法flatMap()和flat()

Array.prototype.flatMap()

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

//只有一層

const arr1 = [1, 2, 3, 4,[5],6,[7]];

const res=arr1.flatMap(x =>x)

console.log(res);

//打?。?7) [1, 2, 3, 4, 5, 6, 7]

//兩層時(shí)

const arr2 = [1, 2, 3, 4,[[5]],6,[[[7]]]];

const res=arr2.flatMap(x =>x)

console.log(res);

打?。篬1, 2, 3, 4, [5], 6, [[7]]]

Array.prototype.flat()

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

參數(shù):depth 可選–(指定要提取嵌套數(shù)組的結(jié)構(gòu)深度,默認(rèn)值為 1)

返回值:一個(gè)包含將數(shù)組與子數(shù)組中所有元素的新數(shù)組。

//depth可選,默認(rèn)1

const arr1 = [1, 2, 3, 4,[5],6,[7]];

console.log(arr1.flat());

//打?。?7) [1, 2, 3, 4, 5, 6, 7]

//depth---2

const arr1 = [1, 2, 3, 4,[[5]],[6],[[7]],[[8]]];

console.log(arr1.flat(2));

//打?。?7) [1, 2, 3, 4, 5, 6, 7]

//depth---Infinity 不管有多少層嵌套,都要轉(zhuǎn)成一維數(shù)組

const arr1 = [1, 2, 3, 4,[[5]],[6],[[7]],[[8]],[[[[[[9]]]]]] ];

console.log(arr1.flat(Infinity));

//打?。?9)?[1, 2, 3, 4, 5, 6, 7, 8, 9]

注意:如果原數(shù)組有空位,flat()方法會(huì)跳過(guò)空位。

[1, 2, , 4, 5].flat()

// [1, 2, 4, 5]

那回歸本題,如何實(shí)現(xiàn)一個(gè) flatMap 函數(shù) ?

第一種:沒(méi)說(shuō)不讓用flat;所以有個(gè)取巧的辦法 const flatMap = arr => arr.flat().map(x =>x);

第二種:flat()和flatMap()本質(zhì)上就是是歸納(reduce) 與 合并(concat)的操作。

letarr=[[0,1],[2,3],[4,5]];

letnewArr=arr.reduce((pre,cur)=>{returnpre.concat(cur)}, [])

console.log(newArr);// [0, 1, 2, 3, 4, 5]

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容