基于JavaScript的數(shù)據(jù)結(jié)構(gòu)隊(duì)列動(dòng)畫實(shí)現(xiàn)示例解析
一 摘要
今天給大家介紹一個(gè)基于數(shù)據(jù)結(jié)構(gòu)中的隊(duì)列的一個(gè)動(dòng)畫,在實(shí)現(xiàn)這個(gè)動(dòng)畫之前呢,還是給大家講講,在JavaScript中我們?nèi)绾螌?shí)現(xiàn)一個(gè)隊(duì)列.
二 隊(duì)列
隊(duì)列是一種列表,不同的是隊(duì)列只能在末尾插入元素,在隊(duì)首刪除元素。隊(duì)列用于存儲按順序排列的數(shù)據(jù)。先進(jìn)先出。這點(diǎn)和棧不一樣,在棧中,最后入棧的元素反被優(yōu)先處理??梢詫㈥?duì)列想象成銀行排隊(duì)辦理業(yè)務(wù)的人,排隊(duì)在第一個(gè)的人先辦理業(yè)務(wù),其它人只能排著,直到輪到他們?yōu)橹埂?/p>
隊(duì)列是一種先進(jìn)先出(FIFO)的數(shù)據(jù)結(jié)構(gòu)。隊(duì)列被用在很多地方。比如提交操作系統(tǒng)執(zhí)行一系列進(jìn)程。打印任務(wù)池等。一些仿真系統(tǒng)用來模擬銀行或雜貨店里排隊(duì)的顧客。
隊(duì)列在程序程序設(shè)計(jì)中用的非常的頻繁,因?yàn)閖avascript單線程,所以導(dǎo)致了任何一個(gè)時(shí)間段只能執(zhí)行一個(gè)任務(wù),而且還參雜了異步的機(jī)制.
在JavaScript的運(yùn)用中,通常使用隊(duì)列來進(jìn)行任務(wù)的排序。而任務(wù)隊(duì)列的任務(wù)是按進(jìn)入隊(duì)列的順序延遲執(zhí)行(解決狀態(tài)一致性)的,即當(dāng)前一個(gè)任務(wù)完成后,后面的任務(wù)才被執(zhí)行,如果當(dāng)前沒有任務(wù),則入隊(duì)列的任務(wù)立即執(zhí)行
三 導(dǎo)致的問題
在異步操作執(zhí)行的時(shí)候,同步代碼還在繼續(xù),那么同步代碼依賴異步,自然就會出錯(cuò)多個(gè)同步的任務(wù)在不同的時(shí)間段被調(diào)用
四 具體實(shí)現(xiàn)
第一步 構(gòu)建一個(gè)隊(duì)列
第二步 實(shí)現(xiàn)類方法
1)向隊(duì)列添加元素
2)向隊(duì)列刪除元素
3)讀取隊(duì)列首元素
4)讀取隊(duì)列尾元素
5)顯示隊(duì)列內(nèi)的所有元素
6)判斷隊(duì)列是否為空
第三步 效果展示
)第一步:新建對象
)第一步:運(yùn)行結(jié)果
五 結(jié)論
今天就到這里,明天繼續(xù)給大家講講基于隊(duì)列的動(dòng)畫,其實(shí)大家之前對數(shù)據(jù)結(jié)構(gòu)了解的話,隊(duì)列的操作應(yīng)該不陌生了,隊(duì)列在實(shí)際開發(fā)中還是用的比較多的!
到此這篇關(guān)于基于JavaScript的數(shù)據(jù)結(jié)構(gòu)隊(duì)列動(dòng)畫實(shí)現(xiàn)示例解析的文章就介紹到這了,更多相關(guān)JavaScript的數(shù)據(jù)結(jié)構(gòu)隊(duì)列動(dòng)畫內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Javascript Bootstrap的網(wǎng)格系統(tǒng),導(dǎo)航欄和輪播詳解
這篇文章主要為大家介紹了Javascript Bootstrap的網(wǎng)格系統(tǒng),導(dǎo)航欄和輪播,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來幫助2021-11-11前端音頻可視化Web?Audio實(shí)現(xiàn)示例詳解
這篇文章主要為大家介紹了前端音頻可視化Web?Audio實(shí)現(xiàn)示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-03-03JavaScript實(shí)現(xiàn)留言板實(shí)戰(zhàn)案例
這篇文章主要給大家介紹了關(guān)于JavaScript實(shí)現(xiàn)留言板的相關(guān)資料,使用JavaScript來編寫留言板功能相信大家都不陌生,文中給出了詳細(xì)的示例代碼,需要的朋友可以參考下2023-07-07基于JavaScript實(shí)現(xiàn)的折半查找算法示例
這篇文章主要介紹了基于JavaScript實(shí)現(xiàn)的折半查找算法,結(jié)合實(shí)例形式分析了折半查找的原理、操作步驟及javascript實(shí)現(xiàn)折半查找的相關(guān)操作技巧與注意事項(xiàng),需要的朋友可以參考下2017-04-04JavaScript進(jìn)階教程之函數(shù)的定義、調(diào)用及this指向問題詳解
這篇文章主要給大家介紹了關(guān)于JavaScript進(jìn)階教程之函數(shù)的定義、調(diào)用及this指向問題的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),對大家學(xué)習(xí)或者使用js具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2022-09-09JavaScript 中如何實(shí)現(xiàn)并發(fā)控制
在日常開發(fā)過程中,你可能會遇到并發(fā)控制的場景,比如控制請求并發(fā)數(shù)。那么在 JavaScript 中如何實(shí)現(xiàn)并發(fā)控制呢?在回答這個(gè)問題之前,我們來簡單介紹一下并發(fā)控制。2021-05-05Bootstrap實(shí)現(xiàn)省市區(qū)三級聯(lián)動(dòng)(親測可用)
這篇文章主要為大家詳細(xì)介紹了Bootstrap實(shí)現(xiàn)省市區(qū)三級聯(lián)動(dòng),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-07-07Echarts折線圖設(shè)置線條顏色及線條以下代碼示例
最近項(xiàng)目需要,一直在使用Echarts視圖,現(xiàn)在遇到一個(gè)要修改echarts折線圖顏色的需求,下面這篇文章主要給大家介紹了關(guān)于Echarts折線圖設(shè)置線條顏色及線條以下區(qū)域漸變顏色的相關(guān)資料,需要的朋友可以參考下2024-02-02原生JavaScript實(shí)現(xiàn)滑動(dòng)拖動(dòng)驗(yàn)證的示例代碼
這篇文章主要介紹了原生JavaScript實(shí)現(xiàn)滑動(dòng)拖動(dòng)驗(yàn)證的示例代碼,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12