摘要:作為前端不用算法也可以寫成項(xiàng)目但是如果明白會算法的話你寫起代碼來會更得心應(yīng)手無限分類遞歸多數(shù)用在樹形結(jié)構(gòu)數(shù)據(jù)有這樣一組數(shù)據(jù)張三的兒子張三的兒子李四的兒子張三的兒子的兒子張三李四王五想要得到的結(jié)果是這樣子的張三張三的兒子張三的兒子的兒子張三的
作為前端, 不用算法也可以寫成項(xiàng)目. 但是如果明白會算法的話, 你寫起代碼來會更得心應(yīng)手.
無限分類遞歸 多數(shù)用在樹形結(jié)構(gòu)數(shù)據(jù). 有這樣一組數(shù)據(jù):
const arr = [ { id: 4, name: "張三的兒子", parentId: 1 }, { id: 43, name: "張三的2兒子", parentId: 1 }, { id: 5, name: "李四的兒子", parentId: 2 }, { id: 6, name: "張三的兒子的兒子", parentId: 4 }, { id: 1, name: "張三", parentId: 0 }, { id: 2, name: "李四", parentId: 0 }, { id: 3, name: "王五", parentId: 0 }, ];
想要得到的結(jié)果是這樣子的:
const result = [ { id: 1, name: "張三", parentId: 0, children: [ { id: 4, name: "張三的兒子", parentId: 1, children: [ { id: 6, name: "張三的兒子的兒子", parentId: 4 } ] }, { id: 43, name: "張三的2兒子", parentId: 1 } ] }, { id: 2, name: "李四", parentId: 0, children: [ { id: 5, name: "李四的兒子", parentId: 2 } ] }, { id: 3, name: "王五", parentId: 0 } ];
這里我有兩種做法:
遞歸
充分利用數(shù)據(jù)的引用(堆棧)
第一種:
function rescurve(arr, id) { let treeData = []; arr.forEach(i => { if(i.parentId == id) { treeData.push(i); i.children = rescurve(arr, i.id); } }); return treeData; }; console.log(rescurve(arr, 0)); // 輸出正確的值
這種方法沒什么說的 就是執(zhí)行自身遞歸出想要的結(jié)構(gòu).
第二種:
function setTreeData(arr) { let map = {}; // 構(gòu)建map arr.forEach(i => { map[i.id] = i; // 構(gòu)建以id為鍵 當(dāng)前數(shù)據(jù)為值 }); let treeData = []; arr.forEach(child => { const mapItem = map[child.parentId]; // 獲取當(dāng)前數(shù)據(jù)的parentId是否存在map中 if (mapItem) { // 存在則表示當(dāng)前數(shù)據(jù)不是最頂層數(shù)據(jù) // 注意: 這里的map中的數(shù)據(jù)是引用了arr的它的指向還是arr, 當(dāng)mapItem改變時(shí)arr也會改變 (mapItem.children || ( mapItem.children = [] )).push(child); // 這里判斷mapItem中是否存在children, 存在則插入當(dāng)前數(shù)據(jù), 不存在則賦值children為[]然后再插入當(dāng)前數(shù)據(jù) } else { // 不存在則是組頂層數(shù)據(jù) treeData.push(child); } }); return treeData; }; console.log(setTreeData(arr)); // 輸出正確的值
這里需要注意的是對象的引用, 利用對象的引用改變指向的arr的數(shù)據(jù). 就得到想要的結(jié)構(gòu)
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/107745.html
摘要:整理一下,形成今天的內(nèi)容算法中的遞歸算法。解決來看一下,最終形態(tài)的遞歸方法是什么樣子遞歸運(yùn)算創(chuàng)建樹結(jié)構(gòu)聲明靜態(tài)變量給靜態(tài)變量累加值賦值閉合標(biāo)簽這樣就可以解決了。所以,在之后的遞歸算法中,應(yīng)該小心謹(jǐn)慎,避免出現(xiàn)問題。 原文是在我自己博客中,小伙伴也可以點(diǎn)閱讀原文進(jìn)行跳轉(zhuǎn)查看,還有好聽的背景音樂噢~ ????遞歸,在編碼中應(yīng)該算是一種很常見的算法了。之前在學(xué)習(xí)C語言的時(shí)候,也同樣了解過一些...
遞歸是個(gè)有意思的概念,正如在前面所說,遞歸能讓算法的可讀性大大提高,而且通常要比使用循環(huán)結(jié)構(gòu)更能寫出準(zhǔn)確的算法。這本書形象引入了遞歸,并沒有太深入,所以我進(jìn)行了一點(diǎn)添油加醋。 遞歸 概念 遞歸其實(shí)就是自己調(diào)用自己。可以從多種維度對遞歸分類,我見過的最常見的分類: 直接遞歸 自己直接調(diào)用自己。如: --haskell length :: [a] -> Int length [] = 0 length...
摘要:昨天幫同事解決問題,于是誕生了超優(yōu)雅兩行代碼搞定無限級分類獲取頂級分類這篇文章。這次要解決的問題是根據(jù)分類,獲取所有下級分類的,這里說的所有下級分類,是包含下級下下級下下下級另外剛好在學(xué)習(xí),于是用上了對象。 昨天幫同事解決問題,于是誕生了超優(yōu)雅!兩行代碼搞定 php 無限級分類 獲取頂級分類ID這篇文章。 晚上回家做自己的node.js項(xiàng)目的時(shí)候,又遇到關(guān)于無限級分類的問題了。其實(shí)也不...
摘要:可以看到,我們首先獲取到了所有的數(shù)據(jù),然后按照父級歸類。無限嵌套評論先來看下這個(gè)無限嵌套評論長什么樣子。文件掃描使用遞歸進(jìn)行目錄文件的掃描的栗子。 回顧 上一篇文章我們講到實(shí)戰(zhàn)PHP數(shù)據(jù)結(jié)構(gòu)基礎(chǔ)之遞歸。來回顧下什么是遞歸? 一般來說,遞歸被稱為函數(shù)自身的調(diào)用。 遞歸在開發(fā)中的實(shí)際運(yùn)用 N級分類 無限級的分類在平常的開發(fā)中是常見的需求,并且在不少面試題中都會碰到。不管你做什么項(xiàng)目,應(yīng)該都...
閱讀 1146·2021-11-24 10:27
閱讀 3419·2021-11-18 10:02
閱讀 2467·2021-11-16 11:45
閱讀 3236·2021-11-15 18:10
閱讀 919·2021-09-22 15:23
閱讀 1605·2019-08-30 15:53
閱讀 3100·2019-08-30 13:20
閱讀 1751·2019-08-30 12:53