基于JavaScript的数据结构队列动画实现示例解析


Posted in Javascript onAugust 06, 2020

一 摘要

今天给大家介绍一个基于数据结构中的队列的一个动画,在实现这个动画之前呢,还是给大家讲讲,在JavaScript中我们如何实现一个队列.

二 队列

队列是一种列表,不同的是队列只能在末尾插入元素,在队首删除元素。队列用于存储按顺序排列的数据。先进先出。这点和栈不一样,在栈中,最后入栈的元素反被优先处理。可以将队列想象成银行排队办理业务的人,排队在第一个的人先办理业务,其它人只能排着,直到轮到他们为止。

队列是一种先进先出(FIFO)的数据结构。队列被用在很多地方。比如提交操作系统执行一系列进程。打印任务池等。一些仿真系统用来模拟银行或杂货店里排队的顾客。

队列在程序程序设计中用的非常的频繁,因为javascript单线程,所以导致了任何一个时间段只能执行一个任务,而且还参杂了异步的机制.

在JavaScript的运用中,通常使用队列来进行任务的排序。而任务队列的任务是按进入队列的顺序延迟执行(解决状态一致性)的,即当前一个任务完成后,后面的任务才被执行,如果当前没有任务,则入队列的任务立即执行

三 导致的问题

在异步操作执行的时候,同步代码还在继续,那么同步代码依赖异步,自然就会出错多个同步的任务在不同的时间段被调用

四 具体实现

第一步 构建一个队列

基于JavaScript的数据结构队列动画实现示例解析

第二步 实现类方法

1)向队列添加元素

基于JavaScript的数据结构队列动画实现示例解析

2)向队列删除元素

基于JavaScript的数据结构队列动画实现示例解析

3)读取队列首元素

基于JavaScript的数据结构队列动画实现示例解析

4)读取队列尾元素

基于JavaScript的数据结构队列动画实现示例解析

5)显示队列内的所有元素

基于JavaScript的数据结构队列动画实现示例解析

6)判断队列是否为空

基于JavaScript的数据结构队列动画实现示例解析

第三步 效果展示

)第一步:新建对象

基于JavaScript的数据结构队列动画实现示例解析

)第一步:运行结果

基于JavaScript的数据结构队列动画实现示例解析

五 结论

今天就到这里,明天继续给大家讲讲基于队列的动画,其实大家之前对数据结构了解的话,队列的操作应该不陌生了,队列在实际开发中还是用的比较多的!

到此这篇关于基于JavaScript的数据结构队列动画实现示例解析的文章就介绍到这了,更多相关JavaScript的数据结构队列动画内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
css把超出的部分显示为省略号的方法兼容火狐
Jul 23 Javascript
JavaScript 利用Cookie记录用户登录信息
Dec 08 Javascript
js多级树形弹出一个小窗口层(非常好用)实例代码
Mar 19 Javascript
jquery+ajax+C#实现无刷新操作数据库数据的简单实例
Feb 08 Javascript
整理JavaScript对DOM中各种类型的元素的常用操作
May 05 Javascript
利用Bootstrap实现表格复选框checkbox全选
Dec 21 Javascript
JS简单获取当前年月日星期的方法示例
Feb 07 Javascript
使用jQuery ajaxupload插件实现无刷新上传文件
Apr 23 jQuery
Vue $mount实战之实现消息弹窗组件
Apr 22 Javascript
如何基于vue-cli3.0构建功能完善的移动端架子
Apr 24 Javascript
Node.js爬虫如何获取天气和每日问候详解
Aug 26 Javascript
vue 页面跳转的实现方式
Jan 12 Vue.js
解决vue动态下拉菜单 有数据未反应的问题
Aug 06 #Javascript
JavaScript中ES6规范中let和const的用法和区别
Aug 06 #Javascript
在vue项目中利用popstate处理页面返回的操作介绍
Aug 06 #Javascript
JavaScript中作用域链的概念及用途讲解
Aug 06 #Javascript
解决vue字符串换行问题(绝对管用)
Aug 06 #Javascript
vue 路由缓存 路由嵌套 路由守卫 监听物理返回操作
Aug 06 #Javascript
Vue Router中应用中间件的方法
Aug 06 #Javascript
You might like
PHP实现批量生成App各种尺寸Logo
2015/03/19 PHP
PHP自定义多进制的方法
2016/11/03 PHP
微信公众号OAuth2.0网页授权问题浅析
2017/01/21 PHP
Javascript注入技巧
2007/06/22 Javascript
创建一个复制UBB软件信息的链接或按钮的js代码
2008/01/06 Javascript
innerhtml用法 innertext用法 以及innerHTML与innertext的区别
2009/10/26 Javascript
Javascript闭包用法实例分析
2015/01/23 Javascript
JQuery中extend的用法实例分析
2015/02/08 Javascript
jQuery仿gmail实现fixed布局的方法
2015/05/27 Javascript
AngularJS 过滤器(自带和自建)详解
2016/09/19 Javascript
学习JavaScript图片预加载模块
2016/11/07 Javascript
学好js,这些js函数概念一定要知道【推荐】
2017/01/19 Javascript
vue axios整合使用全攻略
2018/05/24 Javascript
javascript中的event loop事件循环详解
2018/12/14 Javascript
js的各种数据类型判断的介绍
2019/01/19 Javascript
JS实现的字符串数组去重功能小结
2019/06/17 Javascript
vue history 模式打包部署在域名的二级目录的配置指南
2019/07/02 Javascript
Node.JS用纯JavaScript生成图片或滑块式验证码功能
2019/09/12 Javascript
Python 解析XML文件
2009/04/15 Python
python的正则表达式re模块的常用方法
2013/03/09 Python
用Python的SimPy库简化复杂的编程模型的介绍
2015/04/13 Python
在Python中使用matplotlib模块绘制数据图的示例
2015/05/04 Python
Python优化技巧之利用ctypes提高执行速度
2016/09/11 Python
Python中整数的缓存机制讲解
2019/02/16 Python
python实现随机漫步方法和原理
2019/06/10 Python
PyQt4实时显示文本内容GUI的示例
2019/06/14 Python
python机器学习实现决策树
2019/11/11 Python
python3实现用turtle模块画一棵随机樱花树
2019/11/21 Python
python 利用turtle库绘制笑脸和哭脸的例子
2019/11/23 Python
2014小学生国庆65周年演讲稿
2014/09/21 职场文书
事业单位个人查摆问题及整改措施
2014/10/28 职场文书
员工离职感谢信
2015/01/22 职场文书
2015年第十五个全民国防教育日宣传活动方案
2015/05/06 职场文书
2016年基层党支部书记公开承诺书
2016/03/25 职场文书
Python爬虫之爬取哔哩哔哩热门视频排行榜
2021/04/28 Python
8g内存用python读取10文件_面试题-python 如何读取一个大于 10G 的txt文件?
2021/05/28 Python