javascript如何合并多層級(jí)數(shù)組
javascript合并多層級(jí)數(shù)組
需求
返回一個(gè)數(shù)組的最低層級(jí)展現(xiàn)(遍歷出數(shù)組中每個(gè)元素)
- 輸入:一個(gè)數(shù)組
- 輸出:修改后的單層數(shù)組
代碼
const deepFlatten = arr=>[].concat(...arr.map(v=>Array.isArray(v)?deepFlatten(v) : v)); console.log('[1,[2],[3,[4]],[5,[6,[7,8]]]]合并后的數(shù)組為:'+deepFlatten([1,[2],[3,[4]],[5,[6,[7,8]]]]));
效果
一點(diǎn)想法
Array的map()方法會(huì)返回處理后的結(jié)果,搭配使用ES6中新的特性——擴(kuò)展運(yùn)算符…使遞歸更加高效、易懂。
javascript數(shù)組操作合集
數(shù)組操作:
改變?cè)瓟?shù)組
arr.push(value)
數(shù)組尾部增加arr.pop()
數(shù)組尾部刪除arr.unshift(value)
數(shù)組頭部增加arr.shift()
數(shù)組頭部刪除arr.sort((a,b)=>a-b)
數(shù)組排序(升序)arr.splice(start,length,value…)
數(shù)組指定位置增刪arr.reverse()
數(shù)組倒置delete arr[i]
數(shù)組清空某一個(gè)值為undefinedarr.fill(value,start,end)
填充數(shù)組arr.copyWithin(targe,start,end)
數(shù)組切片復(fù)制到數(shù)組新位置arr.toString()
數(shù)組轉(zhuǎn)化成字符串Array.from(arr)
set類(lèi)型等類(lèi)數(shù)組轉(zhuǎn)化成數(shù)組
不改變?cè)瓟?shù)組
arr.forEach(fn)
遍歷arr.filter(fn)
篩選arr.map(fn)
遍歷arr.slice(start,end)
裁剪arr.findIndex((item,index,arr)=>{})
找值,返回序號(hào)arr.find(fn)
找值,返回值arr.indexOf(item,start)
找值,返回序號(hào),不能查找NaNarr.includes(item,index)
找值,返回boolean,可查找NANarr.lastIndexOf(item,start)
反向找值,返回序號(hào)arr.some(fn)
找是否存在,返回booleanarr.every(fn)
所有子項(xiàng)是否條件都符合,返回booleanarr.join(‘’)
用什么拼接arr.reduce(fn)
數(shù)組累計(jì)執(zhí)行arr.reduceRight(fn)
for(let [k,v] of a.entries())
遍歷key和valuearr.flat(層級(jí))
層級(jí)攤平arr.flatMap(fn)
類(lèi)似map,層級(jí)無(wú)視arr.concat(value)
合并數(shù)組Array.isArray(arr)
判斷是否是數(shù)組arr.entries()
返回?cái)?shù)組的課迭代對(duì)象,key和valuearr.keys()
返回?cái)?shù)組的課迭代對(duì)象arr.values()
返回?cái)?shù)組的課迭代對(duì)象
例:let a = [11,22,33] 求和
ruduce((sum,item)=>{sum+=item;return sum}) /* ? ? 確定對(duì)象o是不是類(lèi)數(shù)組對(duì)象 */ function isArrayLike(o) { ? ? if (o ? ? ? ? && typeof o === 'object' && ? ? ? ? Number.isFinite(o.length) && ? ? ? ? o.length >= 0 && ? ? ? ? Number.isInteger(o.length) && ? ? ? ? o.length < 4294967295) { ? ? ? ? return true ? ? } else { ? ? ? ? return false ? ? } }
總結(jié)
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
JS實(shí)現(xiàn)在線統(tǒng)計(jì)一個(gè)頁(yè)面內(nèi)鼠標(biāo)點(diǎn)擊次數(shù)的方法
這篇文章主要介紹了JS實(shí)現(xiàn)在線統(tǒng)計(jì)一個(gè)頁(yè)面內(nèi)鼠標(biāo)點(diǎn)擊次數(shù)的方法,實(shí)例分析了javascript操作Cookie實(shí)現(xiàn)計(jì)數(shù)的技巧,需要的朋友可以參考下2015-02-02JS實(shí)現(xiàn)商城秒殺倒計(jì)時(shí)功能(動(dòng)態(tài)設(shè)置秒殺時(shí)間)
這篇文章主要介紹了JS實(shí)現(xiàn)商城秒殺倒計(jì)時(shí)功能(動(dòng)態(tài)設(shè)置秒殺時(shí)間),本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-12-12利用原生js實(shí)現(xiàn)html5小游戲之打磚塊(附源碼)
這篇文章主要給大家介紹了關(guān)于利用原生js實(shí)現(xiàn)html5小游戲之打磚塊的相關(guān)資料,這是最近工作遇到的一個(gè)小需求,文中通過(guò)示例代碼介紹的非常詳細(xì),并分享了完整的源碼供大家參考學(xué)習(xí),需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧。2018-01-01微信小程序登錄數(shù)據(jù)解密及狀態(tài)維持實(shí)例詳解
這篇文章主要介紹了微信小程序登錄數(shù)據(jù)解密及狀態(tài)維持,結(jié)合實(shí)例形式分析了微信小程序解密敏感信息及獲取session保持登陸狀態(tài)的相關(guān)操作技巧,需要的朋友可以參考下2019-05-05聊聊JavaScript如何實(shí)現(xiàn)繼承及特點(diǎn)
“繼承”是面向?qū)ο缶幊汤锩娼?jīng)常提及到的概念,它的目的是實(shí)現(xiàn)代碼復(fù)用。這篇文章主要介紹了聊聊JavaScript如何實(shí)現(xiàn)繼承及特點(diǎn),有興趣的可以了解一下。2017-04-04wangEditor編輯器失去焦點(diǎn)后仍然可以在原位置插入圖片分析
本文給大家?guī)?lái)的是一款非常不錯(cuò)的富文本編輯器WangEditor,他最大的特點(diǎn)是它在ie6,7,8上都可以做到失去焦點(diǎn)后仍然可以在原位置插入圖片,而且代碼量很少,下面我們就來(lái)分析下他是如何實(shí)現(xiàn)的呢2015-05-05JavaScript常規(guī)加密技術(shù)實(shí)現(xiàn)方式詳解
這篇文章主要為大家介紹了JavaScript常規(guī)加密技術(shù)實(shí)現(xiàn)方式詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-04-04js實(shí)現(xiàn)緩動(dòng)動(dòng)畫(huà)
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)緩動(dòng)動(dòng)畫(huà),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-11-11小程序從手動(dòng)埋點(diǎn)到自動(dòng)埋點(diǎn)的實(shí)現(xiàn)方法
這篇文章主要介紹了小程序從手動(dòng)埋點(diǎn)到自動(dòng)埋點(diǎn)的實(shí)現(xiàn)方法,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-01-01