从入门到放弃的javaScrip——队列
队列数据结构
队列是遵循FIFO(First In First Out,先进先出,也称为先来先服务)原则的一组有序的项。队列在尾部添加新元素,并从顶部移除元素。最新添加的元素必须排在队列的末尾。
现实中,很常见的例子就是排队。在计算机科学里面是打印队列。
创建队列
我们需要创建自己的类来表示一个队列,先从最基本的声明开始:
function Queue(){// 这里是属性和方法
}
复制代码
首先需要一个用于存储队列中元素的数据结构。我们可以使用数组,就像上一章 Stack 类中那样使用(你会发现其实两者很相似,只是添加和移除元素不一样而已。)
let items = []
复制代码
接下来需要声明一些队列可用的方法。
enqueue(element(s)):向队列尾部添加一个(或多个)新的项。 dequeue():移除队列中的第一个(排列在队伍最前面的)项,并返回被移除的元素 front():返回队列中的第一个元素——最先被添加,也将是最先被移除的元素。队列不做任何变动(不移除元素,只返回元素信息——与 Stack 类的 peek 方法非常相似) isEmpty():如果队列中不包含任何元素,返回 ture,否则返回 false size():返回队列包含的元素个数,与数组的 length 属性类似。 向队列添加元素
首先要实现的是 enqueue 方法。这个方法负责向队列中添加新元素,还有一个非常重要的细节,新的项目只能添加到队列末尾:
this.enqueue = function(element){return items.push(element);
};
复制代码
从队列中移除元素
接下来就是 dequeue 方法,这个方法负责从队列中移除项。由于队列遵循先进先出原则,最先添加的项也是要最先被移除的。数组中的 shift 方法会从数组中移除存储在索引0(第一个位置)的元素。
this.dequeue = function(element){return items.shift();
}
复制代码
只有 enqueue 方法和 dequeue 方法可以添加和移除元素,这样就确保了 Queue 类遵循先进先出的原则。
查看队列头元素
为我们类实现一些额外的辅助方法。我们想知道队列最前面是什么,可以使用 front 方法查看
this.front = function(){return items[0];
}
复制代码
检查队列是否为空
this.isEmpty = function(){return items.length == 0;
}
复制代码
查看队列的长度
this.size = function(){return items.length;
}
复制代码
打印队列元素
this.print = function(){console.log(items.toString());
}欢迎加入全栈开发交流群一起学习交流:864305860
复制代码
实例
function Queue(){let items = [];this.enqueue = function(element){return items.push(element);}this.dequeue = function(){return items.shift();}this.front = function(){return items[0];}this.isEmpty = function(){return items.length == 0;}this.size = function(){return items.length;}this.clear = function(){items = [];}this.print = function(){console.log(items.toString());}}欢迎加入全栈开发交流群一起学习交流:864305860let queue = new Queue(); // 新建 类 Queue 的实例 queue console.log(queue.isEmpty()); // 队列没有元素,返回 truequeue.enqueue(5); // 先队列中加 5queue.enqueue(8); // 先队列中加 8queue.dequeue(); // 减去队列的开头console.log(queue.front()); // 8queue.enqueue(11); // 先队列中加 11console.log(queue.size()); // 队列的长度 2console.log(queue.isEmpty()); // 队列有元素,返回 falsequeue.enqueue(15); // 先队列中加 15queue.print(); // 输出队列中的元素 8,11,15
复制代码
使用ES6 语法实现的 Queue 类 我们使用一个 WeakMap 来保存私有属性items,并用外层函数(闭包)来封装 Queue 类。
let Queue = (function(){
const items = new WeakMap(); // 声明了一个 WeakMap 类型的变量 items
class Queue{constructor(){items.set(this, []) // 在 constructor 中,以this(Stack类自己引用)为键,把代表栈的数组存入 items}enqueue(element){let q = items.get(this);q.push(element);}dequeue (){let q = items.get(this);let r = q.shift();return r;}front (){let q = items.get(this);return q[0];}isEmpty (){let q = items.get(this);return q.length == 0;}size (){let q = items.get(this);let r = q.lengthreturn r;}clear (){items.set(this, [])}print (){let q = items.get(this);console.log(q.toString());}
}
return Queue;
})();
欢迎加入全栈开发交流群一起学习交流:864305860
复制代码
优先队列 队列大量应用在计算机科学以及我们的生活中,其中一个就是优先队列。元素的添加和移除是基于优先级的。现实中的例子就是登机的顺序。头等舱和商务舱的乘客优先级要优于经济舱乘客。
另外一个现实的例子就是医院的候诊室。医生会优先处理病情比较严重的患者。
实现一个队列,有两种选项:设置优先级,然后在正确的位置添加元素;或者用入列操作添加元素,然后按照优先级操作它们。在这个实例中,我们会在正确的位置添加元素,因此可以对它们使用默认的出列操作。
function ProrityQueue(){let items = [];function QueueElement(element, priority){ // 参数包含了添加到队列的元素以及其的优先级this.element = element;this.priority = priority;}this.enqueue = function(element, priority){ let queueElement = new QueueElement(element, priority);let added = false;// 如果队列为空可以直接将元素插入,否则就要比较元素与该元素的优先级。// 当找到一个比要添加元素的 priority 值更高(优先级更低)的项时,// 我们就把元素插入它之前,但是如果优先级相同的话就遵循先进先出的原则for(let i = 0; i < items.length; i++){if(queueElement.priority < items[i].priority ){items.splice(i,0,queueElement);added = true;break;}}if(!added){// 如果添加元素的 priority 值大于任何已有的元素,把它添加到队列的末尾就行了items.push(queueElement);}}this.dequeue = function(){return items.shift();}this.front = function(){return items[0];}this.isEmpty = function(){return items.length == 0;}this.size = function(){return items.length;}this.clear = function(){items = [];} this.print = function(){for(let i = 0; i < items.length; i++){console.log(`${items[i].element} - ${items[i].priority}`);}}
}
let prorityQueue = new ProrityQueue();
prorityQueue.enqueue('John',2);
prorityQueue.enqueue('Mike',1);
prorityQueue.enqueue('Jenny',1);
prorityQueue.print();
/*Mike - 1Jenny - 1John - 2
*/欢迎加入全栈开发交流群一起学习交流:864305860
复制代码
JavaScript 任务队列
当我们在浏览器中打开新标签时,就会创建一个任务队列。这是因为每个标签都是单线程处理所有的任务,它被称为 事件循环。浏览器要负责多个任务,如渲染 HTML ,执行 JavaScript 代码,处理用户交互(用户输入,鼠标点击等),执行和处理异步请求。
本次给大家推荐一个免费的学习群,里面概括移动应用网站开发,css,html,webpack,vue node angular以及面试资源等。 对web开发技术感兴趣的同学,欢迎加入Q群:864305860,不管你是小白还是大牛我都欢迎,还有大牛整理的一套高效率学习路线和教程与您免费分享,同时每天更新视频资料。联系我们QQ群:864305860 最后,祝大家早日学有所成,拿到满意offer,快速升职加薪,走上人生巅峰。
从入门到放弃的javaScrip——队列相关推荐
- 【从入门到放弃-ZooKeeper】ZooKeeper实战-分布式队列
前言 上文[从入门到放弃-ZooKeeper]ZooKeeper入门中,我们学习了ZooKeeper的简单安装和cli使用. 接下来我们开始基于java API的实战编程.本文先来写一个分布式队列的代 ...
- OkHttp框架从入门到放弃,解析图片使用Picasso裁剪,二次封装OkHttpUtils,Post提交表单数据...
OkHttp框架从入门到放弃,解析图片使用Picasso裁剪,二次封装OkHttpUtils,Post提交表单数据 我们这片博文就来聊聊这个反响很不错的OkHttp了,标题是我恶搞的,本篇将着重详细的 ...
- 【open stack】openstack从入门到放弃
原文地址:http://www.cnblogs.com/linkenpark/p/5898598.html openstack从入门到放弃 目录: 为何选择云计算/云计算之前遇到的问题 什么是云计算 ...
- iOS即时通讯,从入门到“放弃”?
image 前言 本文会用实例的方式,将iOS各种IM的方案都简单的实现一遍.并且提供一些选型.实现细节以及优化的建议. 注:文中的所有的代码示例,在github中都有demo: iOS即时通讯,从入 ...
- iOS即时通讯从入门到“放弃”?
前言 本文会用实例的方式,将iOS各种IM的方案都简单的实现一遍.并且提供一些选型.实现细节以及优化的建议. 注:文中的所有的代码示例,在github中都有demo: iOS即时通讯,从入门到&quo ...
- Java从入门到放弃-序言
Java从入门到放弃 前言 本人希望由浅及深的探讨java的底层原理,和编程思想,与大家一起学习提升对程序语言的认知.由于自己是理工科出身,所以对底层原理往往非常感兴趣.那么就跟我一起学习Java吧. ...
- OkHttp框架从入门到放弃,解析图片使用Picasso裁剪,二次封装OkHttpUtils,Post提交表单数据
OkHttp框架从入门到放弃,解析图片使用Picasso裁剪,二次封装OkHttpUtils,Post提交表单数据 我们这片博文就来聊聊这个反响很不错的OkHttp了,标题是我恶搞的,本篇将着重详细的 ...
- Scala从入门到入土(从入门到放弃)
Scala从入门到入土(从入门到放弃) 1 Scala介绍 Scala是一门 综合了 面向对象的 函数式编程的 基于JVm的 语言 特点: 1 语法简洁 2 开发速度快 , 运行速度快 3 兼容 Ja ...
- AI从入门到放弃2:CNN的导火索,用MLP做图像分类识别?
来源 | 腾讯知乎专栏 作者 | AIoys(腾讯员工,后台工程师) 项目文档和代码在此:github项目地址: https://github.com/zsysuper/AI_Notes ▌一.前言 ...
最新文章
- ReactiveCocoa入门-part2
- php中include和require,在PHP中include和require到底有什么区别呢?
- PHP+jquery 树状菜单
- antd的 input有下拉_解决antd 下拉框 input [defaultValue] 的值的问题
- python一个函数调用另一个函数的返回值_在另一个函数中使用返回值
- 乐高创意机器人moc_LEGO乐高MOC作品欣赏:超有爱机器人偶E-MOTE
- 77.Android之代码混淆
- Charles 映射本地文件map local
- 6.8 2.23-2.26
- 修改Jupyter Notebook的默认路径
- 计算机课的十个小游戏制作教程,腾讯内容开放平台
- Android实现MP4边下边播(边缓存边播放、在线播放)原理与代码
- PWM的占空比、分辨率
- Typora完整教程
- 【智能车学习】FTM模块
- Cree捐赠350万美元支持纽约理工学院的STEM教育项目,帮助培训未来的高科技劳动力
- PG14新特性--恢复和VACUUM的加速
- linux分区管理,Linux下磁盘分区管理
- XJTU第十三周大计基编程作业
- JAVA程序计算圆的周长面积
热门文章
- 对XX证券报关于物联网操作系统的几个问题的答复
- ACCEPT()和ACCEPT4()
- 游标对于分页存储过程
- 如何使得按确定和取消按纽转到两个不同的页面!
- GridView控件修改、删除示例(修改含有DropDownList控件)
- 关于Dreamweaver乱码问题的解决方案
- 在DataGrid中显示图片
- 概率论中均值、方差、标准差介绍及C++/OpenCV/Eigen的三种实现
- 【Qt】Qt再学习(十二):QGraphicsItem
- oracle @spool,Oracle spool 用法小结