GitHub 上值得前端学习的数据结构与算法项目
Hello，大家好，我是你們的 前端章魚貓。
簡介
前端章魚貓從 2016 年加入 GitHub，到現(xiàn)在的 2020 年，快整整 5 個年頭了。
相信很多人都沒有逛 GitHub 的習(xí)慣，因此總會有開源信息的不對稱，有哪些優(yōu)秀的前端開源項目值得學(xué)習(xí)的也不知道。
從 2018 年開始，我就養(yǎng)成了每天逛 GitHub 的習(xí)慣，一般在早上上班前或者中午午休的時候都會逛一下。
看看每天都開源了哪些好的前端項目，還有用到的主流前端技術(shù)棧又是哪些，值得我去學(xué)習(xí)的。
因此也收藏了不少好的開源項目，在此推薦給大家，每周會有一到三篇的文章推送。
希望你在瀏覽、學(xué)習(xí)了前端章魚貓推薦的這些開源項目的過程中，你能學(xué)習(xí)到更多編程知識、提高編程技巧、找到編程的樂趣。
★【前端GitHub】，專注于挖掘 GitHub 上優(yōu)秀的前端開源項目，抹平你的前端信息不對稱，涵蓋 JavaScript、Vue、React、Node、小程序、Flutter、Deno、HTML、CSS、數(shù)據(jù)結(jié)構(gòu)與算法 等等。
”以下為【前端GitHub】的第二期內(nèi)容。
前言
★算法為王。
”★想學(xué)好前端，先練好內(nèi)功，內(nèi)功不行，就算招式練的再花哨，終究成不了高手；只有內(nèi)功深厚者，前端之路才會走得更遠(yuǎn)。
”本文推薦幾個 GitHub 上值得前端學(xué)習(xí)的數(shù)據(jù)結(jié)構(gòu)與算法項目，包含 gif 圖的演示過程與視頻講解。
數(shù)據(jù)結(jié)構(gòu)與算法
關(guān)于數(shù)據(jù)結(jié)構(gòu)與算法的 GitHub 項目，star 數(shù)由高到低排序。
javascript-algorithms
★https://github.com/trekhleb/javascript-algorithms
”該倉庫包含了多種基于 JavaScript 的算法與數(shù)據(jù)結(jié)構(gòu)。
每種算法和數(shù)據(jù)結(jié)構(gòu)都有自己的 README，包含相關(guān)說明和鏈接，以便進一步閱讀 (還有 YouTube 視頻) 。
數(shù)據(jù)結(jié)構(gòu)包含了 鏈表、雙向鏈表、隊列、棧、哈希表(散列)、堆、優(yōu)先隊列、字典樹、樹、優(yōu)先隊列、二叉查找樹、AVL 樹、紅黑樹、線段樹、樹狀數(shù)組、圖、并查集、布隆過濾器
算法包含了 算法主題 和 算法范式。
其中算法主題又包含了：數(shù)學(xué)、集合、字符串、搜索、排序、鏈表、樹、圖、加密、機器學(xué)習(xí)。
算法范式：算法范式是一種通用方法，基于一類算法的設(shè)計。這是比算法更高的抽象，就像算法是比計算機程序更高的抽象。
算法范式包含了：BF 算法、貪心法、分治法、動態(tài)編程、回溯法、Branch & Bound 等等。
這項目還出了對應(yīng)的教學(xué)視頻，總共 81 個視頻講解，每個視頻大概 5 - 10分鐘左右，還能學(xué)習(xí)英語哦 ????
★youtube 的教學(xué)視頻：https://www.youtube.com/playlist?list=PLLXdhg_r2hKA7DPDsunoDZ-Z769jWn4R8
”前端章魚貓之前學(xué)習(xí)算法的時候，也在這個項目中收益良多呢！
而且這個項目還一直有維護和更新內(nèi)容哦！真的非常不錯的一個項目！
algorithm-visualizer
★https://github.com/algorithm-visualizer/algorithm-visualizer
”算法可視化工具是一個交互式的在線平臺，可以從代碼中可視化算法。
通過可視化方法學(xué)習(xí)算法變得容易得多。
Algorithm Visualizer 是一款有趣的在線開源工具，內(nèi)含多種算法并進行了直觀可視化呈現(xiàn), 讓學(xué)習(xí)算法和數(shù)據(jù)結(jié)構(gòu)更加直觀。
目前支持的算法包括回溯法、加密算法、動態(tài)規(guī)劃、圖搜索、貪婪算法、搜索算法、排序算法等。
Algorithm Visualizer 的目錄區(qū)，選擇任何算法，中間就會動態(tài)演示，日志輸出區(qū)記錄每次搜索的過程。
該算法可視化工具是一個用 React 編寫的 web 應(yīng)用程序。它包含 UI 組件并將命令解釋為可視化。
如果你是算法初學(xué)者，強烈推薦這個「算法可視化」工具 Algorithm Visualizer，很清晰地繪制了每一個基礎(chǔ)算法的原理和運作流程。
算法可視化工具algo
★algo: https://github.com/wangzheng0822/algo
”數(shù)據(jù)結(jié)構(gòu)和算法必知必會的 50 個代碼實現(xiàn)。
包含數(shù)組、鏈表、棧、隊列、遞歸、排序、二分查找、散列表、字符串、二叉樹、堆、圖、回溯、分治、動態(tài)規(guī)劃 等。
每個代碼實現(xiàn)有解釋，測試用例。
//?選擇排序 const?selectionSort?=?(arr)?=>?{if?(arr.length?<=?1)?return//?需要注意這里的邊界,?因為需要在內(nèi)層進行?i+1后的循環(huán)，所以外層需要?數(shù)組長度-1for?(let?i?=?0;?i?<?arr.length?-?1;?i++)?{let?minIndex?=?ifor?(let?j?=?i?+?1;?j?<?arr.length;?j++)?{if?(arr[j]?<?arr[minIndex])?{minIndex?=?j?//?找到整個數(shù)組的最小值}}const?temp?=?arr[i]arr[i]?=?arr[minIndex]arr[minIndex]?=?temp}console.log(arr) }const?test?=?[4,?5,?6,?3,?2,?1] bubbleSort(test) const?testSort?=?[4,?1,?6,?3,?2,?1] insertionSort(testSort) const?testSelect?=?[4,?8,?6,?3,?2,?1,?0,?12] selectionSort(testSelect)該倉庫是《數(shù)據(jù)結(jié)構(gòu)和算法之美》《設(shè)計模式之美》專欄作者創(chuàng)建的，前端章魚貓也學(xué)習(xí)過他的《數(shù)據(jù)結(jié)構(gòu)和算法之美》，非常不錯的學(xué)習(xí)教程。
awesome-algorithms
★https://github.com/mgechev/javascript-algorithms
”此存儲庫包含不同著名計算機科學(xué)算法的 javascript 實現(xiàn)。
該倉庫是不錯的，不方便學(xué)習(xí)的地方就是需要安裝依賴并運行才能看到效果及文檔。
Call:npm?installTo?setup?repository?with?documentationnpm?run?docThis?will?build?the?documentation?and?open?it?in?your?browser.JS-Sorting-Algorithm
★https://github.com/hustcc/JS-Sorting-Algorithm
”一本關(guān)于排序算法的 GitBook 在線書籍 《十大經(jīng)典排序算法》，使用 JavaScript & Python & Go & Java 實現(xiàn)。
包含冒泡排序、選擇排序、插入排序、希爾排序、歸并排序、快速排序、堆排序、計數(shù)排序、桶排序、基數(shù)排序。
該倉庫的文章有定義有解釋、有代碼實現(xiàn)、還有動態(tài)圖，入門十大經(jīng)典排序算法是個不錯的教程。
JavaScript 數(shù)據(jù)結(jié)構(gòu)與算法之美
★https://github.com/biaochenxuying/blog#-javascript-%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84%E4%B8%8E%E7%AE%97%E6%B3%95%E4%B9%8B%E7%BE%8E
”包含了 十大經(jīng)典排序算法 的思想、代碼實現(xiàn)、一些例子、復(fù)雜度分析、動畫、還有算法可視化工具。
這是比較精簡的 JavaScript 數(shù)據(jù)結(jié)構(gòu)與算法 的講解。
該倉庫總共寫了 10 篇算法入門的文章
時間和空間復(fù)雜度
線性表（數(shù)組、隊列、棧、鏈表）
實現(xiàn)一個前端路由，如何實現(xiàn)瀏覽器的前進與后退 ？
棧內(nèi)存與堆內(nèi)存 、淺拷貝與深拷貝
遞歸
非線性表（樹、堆）
冒泡排序、選擇排序、插入排序
歸并排序、快速排序、希爾排序、堆排序
計數(shù)排序、桶排序、基數(shù)排序
十大經(jīng)典排序算法匯總
GitHub 上 170K+ Star 的前端學(xué)習(xí)的數(shù)據(jù)結(jié)構(gòu)與算法項目
也是非常不錯的數(shù)據(jù)結(jié)構(gòu)與算法的入門學(xué)習(xí)資料。
daily-algorithms
★https://github.com/barretlee/daily-algorithms
”算法，每日練習(xí)的一個項目。
★ 表示 easy，★★ 表示 medium，★★★ 表示 hard；
題目主要來自 leetcode，可能會適當(dāng)變換題設(shè)，改變難度；
對于 ★ 和 ★★ 難度的題目，每天的量會隨機出現(xiàn) 1~5 個，尤其是 ★ 的題目，比較簡單。
白天出題，盡量晚上給出參考答案。
項目也不錯，是以參與討論的形式與大家一起學(xué)習(xí)數(shù)據(jù)結(jié)構(gòu)與算法的。
就是內(nèi)容積累還不夠多，還不夠火。
JavaScript 更多 ...
★https://github.com/search?l=JavaScript&o=desc&q=algo&s=stars&type=Repositories
”還想知道更多好的數(shù)據(jù)結(jié)構(gòu)與算法項目，可以點擊上面的鏈接進行搜索。
最后
Star 數(shù)最多，但是并不代表該項目就最好并適合你哦，因為有些項目早于幾年前就不再更新與維護了。
本文推薦的都是一些真的實用并還在更新的開源倉庫，估計都比較適合前端學(xué)習(xí)。
平時如何發(fā)現(xiàn)好的開源項目，可以看看這篇文章：GitHub 上能挖礦的神仙技巧 - 如何發(fā)現(xiàn)優(yōu)秀開源項目。
★本文原文 GitHub 地址：https://github.com/biaochenxuying/FrontEndGitHub
”覺得有用 ？喜歡就收藏，順便點個贊吧，你的支持是我最大的鼓勵！
在公眾號后臺回復(fù)：電子書 ，可以獲得160本前端精華書籍哦。
往期項目2020-WEB開發(fā)路線圖，和即將到來的 2021-WEB技術(shù)清單
總結(jié)
以上是生活随笔為你收集整理的GitHub 上值得前端学习的数据结构与算法项目的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 2020-WEB开发路线图，和即将到来的
- 下一篇： 2017年html5行业报告,云适配发布