JavaScript 遞歸之深度優(yōu)先和廣度優(yōu)先

在前端工作當(dāng)中，經(jīng)常會(huì)遇到樹組件、樹形表格、機(jī)構(gòu)樹等功能，這個(gè)時(shí)候就需要對(duì)后端返回的數(shù)據(jù)進(jìn)行處理，在對(duì)樹形數(shù)據(jù)處理時(shí)，一般是需要用到遞歸來(lái)處理，而遞歸又分為了深度優(yōu)先和廣度優(yōu)先，這里給出了兩種遞歸方法的示例。

1 數(shù)據(jù)準(zhǔn)備

這里是示例當(dāng)中用到的數(shù)據(jù)

const tree = {id: 1,children: [{id: 2,children: [{id: 4,children: [{ id: 8 },{ id: 9 },]},{ id: 5 },]},{id: 3,children: [{ id: 6 },{ id: 7 },]},] };

2 深度優(yōu)先

顧名思義，深度優(yōu)先的意思就是以深度為主。我們可以把樹機(jī)構(gòu)的分支看作為一個(gè)個(gè)路徑，當(dāng)進(jìn)行深度優(yōu)先的遞歸時(shí)，程序會(huì)在一條路徑下，一直走下去，直到不能在走為止，然后換一個(gè)路徑繼續(xù)走到底，走的層級(jí)很深。

通過(guò)代碼打印的 1, 2, 4, 8, 9 可以看到是把第一個(gè)分支里面走到了底。

代碼示例：

function recursion(list){list.forEach(item => {console.log(item.id); // 打印idif(item.children){recursion(item.children);}}); } recursion([tree]); // 調(diào)用函數(shù)，會(huì)依次打印：1, 2, 4, 8, 9, 5, 3, 6, 7

3 廣度優(yōu)先

前面說(shuō)深度優(yōu)先是一條道走到底，類似于遇見了岔道，一條岔道走到了底，直到無(wú)路可走，而廣度優(yōu)先則恰恰相反，廣度優(yōu)先是把每一個(gè)層級(jí)的所有選擇都走一遍，只有當(dāng)?shù)谝粋€(gè)層級(jí)走完之后，才會(huì)走第二個(gè)層級(jí)。

以上面的圖為例，先走到1，然后1走完之后，遇見了2和3，廣度優(yōu)先時(shí)會(huì)先走一下2和3，走完之后，再處理4和5，順序?yàn)? > 2 > 3 > 4 > 5 > 6 > 7 > 8 > 9

代碼示例：

// 方法一： // 先遍歷當(dāng)前節(jié)點(diǎn)，forEach當(dāng)中找到當(dāng)前項(xiàng)所有的子節(jié)點(diǎn)，放到同一個(gè)數(shù)組當(dāng)中 // 也就是找到下一層級(jí)的全部節(jié)點(diǎn) let tempArr = []; function recursion(list){tempArr = [];list.forEach(item => {console.log(item.id);if(item.children){tempArr = tempArr.concat(item.children);}});tempArr.length > 0 && recursion(tempArr); } recursion([tree]); // 調(diào)用函數(shù)，會(huì)依次打印：1, 2, 3, 4, 5, 6, 7, 8, 9// 方法二：使用隊(duì)列的思想，先進(jìn)先出，依次將節(jié)點(diǎn)加入到數(shù)組當(dāng)中，再?gòu)那懊鎻棾?/span> function queueRecursion(){while (tempArr.length){let item = tempArr.shift(); // 彈出第一個(gè)console.log(item.id);if(item.children){tempArr = tempArr.concat(item.children); // 添加節(jié)點(diǎn)}} } let tempArr = []; tempArr = [tree]; queueRecursion(); // 調(diào)用函數(shù)，會(huì)依次打印：1, 2, 3, 4, 5, 6, 7, 8, 9

總結(jié)

以上是生活随笔為你收集整理的JavaScript 递归之深度优先和广度优先的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。