当前位置: 首页 > 编程日记 > 正文

从入门到放弃的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,快速升职加薪,走上人生巅峰。

相关文章:

css控制不换行

white-space:nowrap; 转载于:https://www.cnblogs.com/w8104254/p/4178198.html

(C++)堆排序的3个关键函数

堆排序&#xff1a;指使用堆结构对一个序列进行排序。所以&#xff0c;首先要有一个堆结构。 此处讨论递增排序。以及用最大堆。 注意&#xff1a;让存放堆的数组作为全局变量&#xff0c;n为元素个数&#xff0c;数组存放元素从下标1开始&#xff0c;n结束。 int heap[11] …

android 横竖屏限制如何配置

在开发android的应用中&#xff0c;有时候需要限制横竖屏切换。只需要在AndroidManifest.xml文件中加入android:screenOrientation属性限制。 ndroid:screenOrientation"landscape"是限制此页面横屏显示&#xff0c; ndroid:screenOrientation"portrait"是…

Java面试题总结-Day4

<?xml version"1.0" encoding"utf-8"?> Java面试题总结-Day4Java面试题总结-Day4 Table of Contents 1. ArrayList和LinkedList区别 1.1. 是否线程安全1.2. 底层数据结构1.3. 插入和删除是否受元素位置的影响1.4. 是否支持快速随机访问1.5. 内存空…

Linux 使用者身份與群組記錄的檔案

在我們Linux系統當中&#xff0c;預設的情況下&#xff0c;所有的系統上的帳號與一般身份使用者&#xff0c;還有那個root的相關資訊&#xff0c; 都是記錄在/etc/passwd這個檔案內的。至於個人的密碼則是記錄在/etc/shadow這個檔案下。 此外&#xff0c;Linux所有的群組名稱都…

1098 Insertion or Heap Sort 需再做

1. 应该还做过一道类似的题目&#xff0c;也是要求判断属于哪种排序的中间过程&#xff0c;并要求写出下一轮排序结果&#xff0c;这次的进步是上来就知道用向量存数据&#xff0c;这样方便直接比较&#xff0c;而且下标0不能存元素&#xff0c;因为堆排序的堆是一个完全二叉树…

基于node.js的压缩合并安装

1.构建工具&#xff08;grunt,gulp&#xff09; 下载地址&#xff1a;http://gruntjs.cn/http://gruntjs.com/&#xff08;1&#xff09;安装nodejs(http://www.nodejs.org/) 验证是否安装成功&#xff0c;命令行输入 node -v &#xff08;2&#xff09;grunt 的安装 安装全局…

jenkins 修改工作目录

修改Jenkins路径 Jenkins的默认安装路径是/var/lib/jenkins 现在由于这个根目录的磁盘太小&#xff0c;所以切换到/data 目录下。 Jenkins目录、端口、工作目录等信息在/etc/sysconfig/jenkins 下&#xff0c;所以需要修改这个文件。 将JENKINS_HOME"/var/lib/jenkins&quo…

破一个行业ERP的感想

今天闲来无事&#xff0c;找来破一破。 这个是一个行业性质的ERP软件&#xff0c;有授权码验证&#xff0c;客户机数量限定&#xff0c;以及使用时间限定&#xff0c;被一一破解。 授权码存在明显的绕过bug.客户机数量同样被明文标注在文件中。使用时间也是标注在文件中&#x…

1034 Head of a Gang(图的DFS解法) 擦边大法好

1.题目的大意是给出很多人(结点)之间的通话记录&#xff0c;每两人之间的权重取决于他俩通话权重的总时长&#xff0c;如果一个社区的人数超过2且社区内发生的通话总时长超过给定阈值&#xff0c;那么这属于一个社区。最后要求输出社区的总数&#xff0c;再按照社区头目的姓名字…

Android定位方式和测试方法

Android常用的三种定位方式有&#xff1a;基于GPS定位、基于基站地位、基于wifi定位。 1、基于GPS定位&#xff1a; GPS定位需要GPS模块(硬件)的支持,没有GPS模块是无法进行GPS定位的。 GPS定位最大的优点就是其定位精确度高(一般误差在10m内),无网络也能用;缺点就是耗电高、定…

vue el-form鼠标事件导致页面刷新解决方案;vue 阻止多次点击提交数据通用方法...

一.阻止表单自动提交刷新页面&#xff1a;<el-form><el-form-item :inline"true" submit.native.prevent><el-input keyup.enter.nativesubmit></el-input></el-form-item> </el-form>注意&#xff1a; 鼠标事件导致页面刷新问…

[转]wxODBC(wxWidgets)中使用驱动程序方式打开数据库

wxODBC(wxWidgets)中使用驱动程序方式打开数据库 wxWidgets的文档中都是使用在控制面板/数据源中设定DSN来创建ODBC连接。但是实际上很多小型的应用&#xff0c;只是使用本机的一个Access数据库。而要求使用者学习ODBC的DSN配置明显的增加了软件的使用难度。因此&#xff0c;研…

1076 Forwards on Weibo

1. 这题说的是&#xff0c;微博上人们之间有关注和被关注的关系&#xff0c;如果一个人发博&#xff0c;他的追随者就可能转发&#xff0c;追随者的追随者又可能转发&#xff0c;以此类推。现在给定一个人&#xff0c;求其微博可能被转发的人数&#xff0c;但是注意有一个关注链…

2014年个人工作总结

2014年的日常工作&#xff0c;从技术支持岗位调到市场.社区岗位上&#xff1a;日常技术处理工作变为博客、微信、微博、市场活动策划、发送奖品等。如果以此为界&#xff1a;即毕业10年内的主要是软件研发、团队管理、项目管理&#xff1b;第二个十年开始&#xff0c;有幸从事市…

DAL(数据库访问层)

using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Data;using System.Data.SqlClient;using System.Configuration; /// <summary>///DBHelper 的摘要说明/// </summary>public static class DBHelper{ public …

Navicat for Oracle

1、先解压Navicat for Oracle到任意目录 2、将instantclient-basic-nt-12.1.0.2.0解压到1中目录的instantclient_10_2文件夹下&#xff08;推荐&#xff0c;可随意&#xff09; 3、将instantclient-sqlplus-nt-12.1.0.2.0解压到instantclient_10_2文件夹中的 instantclient_12_…

1013 Battle Over Cities(图的DFS解法)

这题的背景是战争年代&#xff0c;假如城市1被占领&#xff0c;那么所有和城市1相关的公路都要被炸毁&#xff0c;但是这样一来&#xff0c;2和3就不连通了&#xff0c;所以需要补修一条23之间的公路。但是换做城市2或3被占领&#xff0c;1和另一座城市是联通的&#xff0c;并不…

你必须了解的微服务架构设计的10个要点!

近来&#xff0c;几乎人人都在谈论微服务。微服务之所以火热也是因为相对之前的应用开发方式有很多优点&#xff0c;如更灵活、更能适应现在需求快速变更的大环境等。本文将介绍微服务架构设计中的一些要点。 微服务架构设计时有哪些要点呢&#xff1f;先看下图是 Spring Cloud…

企业信息化中常见决策点应对

我和一位朋友在聊天的时候&#xff0c;谈起在甲方的做信息化&#xff0c;和在乙方做信息化的不同点在于&#xff0c;在甲方做信息化&#xff0c;需要搞定为什么要上一个项目。而乙方参与进来的时候&#xff0c;项目其实已经启动了。 是的&#xff0c;作为甲方的我们&#xff0c…

WebView调试

https://developer.chrome.com/devtools/docs/remote-debugging 转载于:https://www.cnblogs.com/daishuguang/p/4194882.html

1013 Battle Over Cities(并查集解法)

关于背景的介绍见1013 Battle Over Cities(图的DFS解法) DFS就是不算特定结点后数连通子图的总数&#xff0c;再减一。我想着那么并查集就是数不算特定节点后&#xff0c;集合元素(根)的个数。但是我弄错了一件事&#xff0c;我是边输入&#xff0c;边合并&#xff0c;然后对于…

FastDFS为什么要结合Nginx?

为什么选择Nginx Nginx 是一个很牛的高性能Web和反向代理服务器, 它具有有很多非常优越的特性: 在高连接并发的情况下&#xff0c;Nginx是Apache服务器不错的替代品: Nginx在美国是做虚拟主机生意的老板们经常选择的软件平台之一. 能够支持高达 50,000 个并发连接数的响应, 感谢…

STL容器[34]

SERVER以读打开FIFO&#xff1b;CLIENT以写打开FIFO&#xff1b;SERVER关闭FIFO&#xff1b;CLIENT向当前FIFO写数据&#xff0c;此时CLIENT获得一个SIGPIPE信号。如果忽略该信号&#xff0c;那么write将返回-1&#xff0c;ERRNO为EPIPE向一个写打开&#xff0c;当对端已经关闭…

企业可视化报表工具选型经验分享

选型背景 我们是一家面向金融行业的系统集成商&#xff0c;每年要做十几个项目&#xff08;看得出来我们并不大/笑哭&#xff09;&#xff0c;项目分大小、做事分先后&#xff0c;可不管怎样都绕不开数据&#xff0c;数据处理经常占项目的大头&#xff0c;所以经常会选择一些市…

1003 Emergency(Dijkstra,Bellman-Ford,SPFA三种解法)

目录 1. Dijkstra解法 2. Bellman-Ford解法 3. SPFA解法 4. Dijkstra解法AC代码 5. Bellman-Ford解法AC代码 6. SPFA解法AC代码 1. Dijkstra解法 这题不仅涉及到基础的解法&#xff0c;还涉及到第二标准(累计军队数量)&#xff0c;以及还要记录最短路径条数。这些都是在…

存储过程4-前台

代码 ALTERproc[dbo].[P_CheckCode](retintoutput,nIdint,tagnvarchar(50),cCodenvarchar(50),nHotelIdint)asbeginifUpper(tag)B_AREAbeginifexists(select1fromB_Area wherecCodecCodeandnHotelIdnHotelIdandnId<>nId) setret1elsesetret-1endelseifUpper(t…

安卓学习-其他-文件读写

在android中的文件放在不同位置&#xff0c;它们的读取方式也有一些不同。 本文对android中对资源文件的读取、数据区文件的读取、SD卡文件的读取及RandomAccessFile的方式和方法进行了整理。供参考。 一、资源文件的读取&#xff1a; 1) 从resource的raw中读取文件数据&#x…

X5同层播放器应用实践

移动端浏览器中的video元素是比较特别的&#xff0c;早期无论是在iOS还是Android的浏览器中&#xff0c;它都位于页面的最顶层&#xff0c;无法被遮挡。后来&#xff0c;这个问题在iOS下得到了解决。但是对Android的大部分浏览器来说&#xff0c;问题仍然存在。X5是腾讯基于Web…

1007 Maximum Subsequence Sum(两种思路)

1.解法1 思路 对于动态规划来说&#xff0c;最关键的就是找到状态转移方程&#xff0c;本题设置一个前向数组&#xff0c;元素predp[i]表示的是以元素i结尾的连续数列和的最大值&#xff0c;转移方程是predp[i] max(predp[i-1]a[i],a[i])。要做的事就是完成这个dp数组&#x…