首頁猿問【比較難】JS多層遞歸遍歷

【比較難】JS多層遞歸遍歷

JavaScript

慕尼黑8549860 2019-10-10 15:55:46

小弟初學(xué)js，遇到一個(gè)難題，關(guān)于把一個(gè)多層數(shù)據(jù)結(jié)構(gòu)的轉(zhuǎn)換成treeview可識(shí)別的格式問題原數(shù)據(jù)格式為：{"root":"body","structure":{"body":["head","foot"],"head":["control","tabs"],"control":["c123","c456","c789"],"tabs":["33","44"],"foot":["footLeft","divEnd"],"footLeft":["footLeftContainer"],"footLeftContainer":["add22","ffff","fff"],"divEnd":["divEnd$111"]}};期望處理成的格式為：[{text:"body",nodes:[{text:"head",nodes:[{text:"control",nodes:[{text:"c123"},{text:"c456"},{text:"c789"}]},{text:"tabs",nodes:[{text:"t33"},{text:"t44"}]}]},{text:"foot",nodes:[{text:"footLeft",nodes:[{text:"footLeftContainer",nodes:[{text:"add22"},{text:"ffff"},{text:"fff"}]}]},{text:"divEnd",nodes:[{text:"divEnd$111"}]}]}]}]原理就是從structure中層層找child，起始點(diǎn)是root節(jié)點(diǎn)的值（即"body"）每個(gè)節(jié)點(diǎn)的child如果不在structure一級(jí)節(jié)點(diǎn)中，則認(rèn)為是葉子節(jié)點(diǎn)想了一天，沒有好辦法，來求助各位前輩

查看完整描述

2 回答

蕭十郎

TA貢獻(xiàn)1815條經(jīng)驗(yàn) 獲得超13個(gè)贊

constdata={root:'body',structure:{body:['head','foot'],head:['control','tabs'],control:['c123','c456','c789'],tabs:['33','44'],foot:['footLeft','divEnd'],footLeft:['footLeftContainer'],footLeftContainer:['add22','ffff','fff'],divEnd:['divEnd$111'],},};/***@param{typeofdata}data*/functionconver(data){constret=[];constcoll=data.structure;constroot={text:data.root};constmap={[data.root]:root};Object.keys(coll).forEach(key=>{map[key]=map[key]||{text:key};coll[key].forEach(item=>{map[item]=map[item]||{text:item};});});Object.keys(coll).forEach(key=>{coll[key].forEach(item=>{if(map[key]){map[key].nodes=map[key].nodes||[];map[key].nodes.push(map[item]);}});});console.log(root);}conver(data);先遍歷每個(gè)節(jié)點(diǎn)存在hash表里,然后再遍歷,根據(jù)parent關(guān)系找到父節(jié)點(diǎn).像樓上一樣,data.structure這個(gè)也可以理解為一張圖,key是一個(gè)頂點(diǎn),數(shù)組是它的鄰邊集合.非遞歸也可以的