在JavaScript中的数据结构(队列)

news2024/7/2 3:56:54

在这里插入图片描述

文章目录

  • 什么是队列?
  • 创建队列
      • 新建队列
      • 队列可用的方法
      • 队列添加元素
      • 队列移除元素
      • 队列查看元素
          • 查看队列头元素
          • 检查队列是否为空
          • 检查队列的长度
          • 打印队列元素
    • 完整队列代码
  • 循环队列
  • 优先队列是什么?
  • 总结


什么是队列?

当我们在浏览器中打开新标签时,就会创建一个任务队列。这是因为每个标签都是单线程处
理所有的任务,它被称为事件循环。浏览器要负责多个任务,如渲染HTML,执行JavaScript代码,处理用户交互(用户输入、鼠标点击等),执行和处理异步请求。

队列(Queue)是一种具有先进先出(FIFO, First-In-First-Out)特性的数据结构,它可以用于在计算机程序中管理和存储元素。在JavaScript中,可以使用数组(Array)或链表(Linked List)等数据结构来实现队列。

其实可以用窗口排队打饭为案例,先来的先排队打饭。
在这里插入图片描述


创建队列

队列主要有两个基本操作: 入队(enqueue)和出队(dequeue)。在队列中,新元素被添加到队列末尾,并等待其他已存在的元素被处理后才能被移除。当删除元素时,总是从队首开始移除元素。

新建队列

创建类来表示一个队列,先从最基本的声明类开始:

function Queue() { 
 //这里是属性和方法
} 

需要一个用于存储队列中元素的数据结构,使用数组,(Queue类和Stack类非常类似,只是添加和移除元素的原则不同):

function Queue() { 
 //用于存储队列中元素的数据结构
 let items = []; 
 //这里是属性和方法
} 

队列可用的方法

  • enqueue(element(s)):向队列尾部添加一个(或多个)新的项。
  • dequeue():移除队列的第一(即排在队列最前面的)项,并返回被移除的元素。
  • front():返回队列中第一个元素——最先被添加,也将是最先被移除的元素。队列不
    做任何变动(不移除元素,只返回元素信息——与Stack类的peek方法非常类似)。
  • isEmpty():如果队列中不包含任何元素,返回true,否则返回false。
  • size():返回队列包含的元素个数,与数组的length属性类似。

队列添加元素

首先要实现的是enqueue方法。这个方法负责向队列添加新元素。这里有一个非常重要的细
节,新的项只能添加到队列末尾:

this.enqueue = function(element){ 
 items.push(element); 
}; 

队列移除元素

接下来要实现dequeue方法。这个方法负责从队列移除项。由于队列遵循先进先出原则,
最先添加的项也是最先被移除的。可以用shift方法,shift方法会从数组中移除存储在索引0(第一个位置)的元素:

this.dequeue = function(){ 
 return items.shift(); 
};

只有enqueue方法和dequeue方法可以添加和移除元素,这样就确保了Queue类遵循先进先
出原则。

队列查看元素

查看队列头元素

现在来为我们的类实现一些额外的辅助方法。如果想知道队列最前面的项是什么,可以用
front方法。这个方法会返回队列最前面的项(数组的索引为0):

this.front = function(){ 
 return items[0]; 
};
检查队列是否为空

可以直接使用length == 0判断,如果队列为空,它会返回true,否则返回false):

this.isEmpty = function(){ 
 return items.length == 0; 
}; 
检查队列的长度

类似于数组的length属性,我们也能实现队列的length。对于集合,最好用size代替length。
因为队列的内部使用数组保存元素,所以能简单地返回队列的长度:

this.size = function(){ 
 return items.length; 
};
打印队列元素

为了检查队列元素,实现一个辅助方法print。把队列元素都输出到控制台:

this.print = function(){ 
 console.log(items.toString()); 
}; 

完整队列代码

function Queue() { 
 //用于存储队列中元素的数据结构
 let items = []; 
 //队列添加元素
 this.enqueue = function(element){ 
  items.push(element); 
 }; 
 //队列移除元素
 this.dequeue = function(){ 
  return items.shift(); 
 };
 //查看队列头元素
 this.front = function(){ 
  return items[0]; 
 };
 //检查队列的长度
 this.size = function(){ 
  return items.length; 
 };
 //打印队列元素
 this.print = function(){ 
  console.log(items.toString()); 
 }; 
} 

循环队列

循环队列,修改版的队列实现。为了解决假上溢问题,引入循环队列,即把向量空间想象为一个首尾相接的圆环,在循环队列中进行出队、入队操作时,头尾指针仍要加1,朝前移动。只不过当头尾指针指向向量上界(MAXNUM-1)时,其加1操作的结果是指向向量的下界0。
在这里插入图片描述


优先队列是什么?

优先队列,队列修改版。元素的添加和移除是基于优先级的。现实的例子有就是机场登机的顺序,头等舱和商务舱乘客的优先级要高于经济舱乘客;迪士尼入园vip先入园等等。
实现一个优先队列,有两种选项:设置优先级,然后在正确的位置添加元素;或者用入列操
作添加元素,然后按照优先级移除它们。因此可以对它们使用默认的出列操作:
在这里插入图片描述


总结

在JavaScript中,队列(Queue)是一种具有先进先出(FIFO, First-In-First-Out)特性的数据结构,它可以用于在计算机程序中管理和存储元素。队列中,新元素被添加到队列末尾,并等待其他已存在的元素被处理后才能被移除。当删除元素时,总是从队首开始移除元素。队列主要有两个基本操作: 入队(enqueue)和出队(dequeue),在JavaScript中可以使用数组(Array)或链表(Linked List)等数据结构来实现队列。除了入队和出队操作,队列还可以提供其他方法,如peek()返回队列头部的值、isEmpty()判断队列是否为空等等,但其基本实现都是基于入队和出队这两个基本操作。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/636605.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【1483. 树节点的第 K 个祖先】

来源:力扣(LeetCode) 描述: 给你一棵树,树上有 n 个节点,按从 0 到 n-1 编号。树以父节点数组的形式给出,其中 parent[i] 是节点 i 的父节点。树的根节点是编号为 0 的节点。 树节点的第 k 个…

pyecharts使用案例二——全国疫情可视化地图开发

代码 import json from pyecharts.charts import Map from pyecharts.options import *f open("./疫情.txt", "r", encoding"UTF-8") data f.read()f.close()# 取到各省份数据 # 将json字符串转为python字典,反序列化 data_dict json.loads(…

vue3-实战-07-管理后台-属性管理模块开发

目录 1-需求原型分析 2-三级分类全局组件封装 2.1-三级分类组件请求接口和数据类型封装 2.2-组件获取数据渲染数据 3-属性管理列表开发 3.1-请求接口和数据类型封装 3.2-获取数据渲染数据 4-新增编辑属性 4.1-需求原型分析 4.2-新增编辑接口封装和数据类型定义 4.3-…

IDEA在Maven settings.xml失效的情况下反编译代码

在我们日常的工作中有时候会遇到需要调试别人的代码的问题,这个时候别人往往会给你一个jar包,这个包里面的代码都是经过编译的,点击打开函数以后都是后缀是.class的文件,我们调试起来非常不方便,这个时候如果我们想要下…

Vue中如何进行剪贴板操作?

Vue中如何进行剪贴板操作? 在Web应用程序中,剪贴板(Clipboard)操作是非常常见的操作之一。Vue.js是一款流行的JavaScript框架,它提供了一些有用的工具来处理DOM元素和用户界面。本文将介绍如何在Vue.js中使用剪贴板操…

行业拐点已至?解码装备制造企业四大转型方向!

当前,国内外经济形势复杂严峻,不稳定、不确定性因素增多。装备制造业企业面对行业增速放缓、内外部环境变化的挑战,叠加国家政策的鼓励与引导,数字化转型已经成为装备制造企业的迫切需求。 01 装备制造业发展现状(SWOT…

抛售股票提现15亿美元救急,英特尔「下手」Mobileye这颗「摇钱树」

本周,全球半导体巨头英特尔宣布,将出售旗下上市公司Mobileye的部分股权,预计价值约15亿美元,股份将从目前的99.3%降至约98.7%。截止昨天收盘,Mobileye的最新市值约为339.4亿美元(同期,英特尔市值…

VSCode连接远程服务器上docker容器进行代码调试

VSCode连接远程服务器上docker容器进行代码调试 1、本教程默认已经在本地安装完毕VSCode,并且安装ssh2、本教程默认已经在服务器端安装完毕docker与nvidia-docker、ssh服务并自动启动、且容器内安装anaconda3、服务器端创建docker容器,并增加端口映射&am…

【JS】时间格式转化相差8小时的原因

文章目录 时间类型UTCGMTCST 出现时间转化中相差8小时的原因 时间类型 UTC 协调世界时,又称世界统一时间、世界标准时间、国际协调时间,简称UTC(Coordinated Universal Time) UTC8即为北京时间,目前一般认为UTC与GMT…

AIGC|我让AI来写今年高考作文

作者:谢凯 | 神州数码云基地-需求分析师 目录 一、人工智能究竟强在哪 //以ChatGPT为例,人工智能其优势何在? 二、BingAI如何处理高考作文 三、总结 一、人工智能究竟强在哪 随着ChatGPT(Chat Generative Pre-trained Transfo…

Vue CLI在 CommonJS 模块中不支持顶级 await 语法的解决办法

这是因为默认情况下,Vue CLI 会将你的代码转换为 CommonJS 模块,而在 CommonJS 模块中不支持顶级 await 语法。 在vue3项目的utils里面的js文件中写export全局调用方法时,打包依赖报错; 解决办法: 新增依赖vue/cli-plugin-top-…

iToolab UnlockGo for Mac,iOS设备解锁工具

iToolab UnlockGo是一款专业的 iPhone/iPad 解锁工具,可以帮助用户解除 iOS 设备的各种锁定,包括屏幕密码、指纹密码、Face ID 等。以下是 iToolab UnlockGo 的一些主要特点: 针对多种锁定类型:iToolab UnlockGo 可以解除多种 iO…

对数组的“reg [7:0] a_tmp[32:0]”理解

数组 在verilog中,对数组reg [7:0] a_tmp[32:0]进行操作时,分不清楚先对[32:0]进行操作还是先对 [7:0]进行操作,为此进行下面的实验。进一步加深对数组的理解。 实验1: reg [7:0] a_tmp[32:0];遍历的方式: integer …

架构师日记-从技术角度揭露电商大促备战的奥秘 | 京东云技术团队

一 背景 今年的618大促已经如期而至,接下来我会从技术的角度,跟大家聊聊大促备战的底层逻辑和实战方案,希望能够解答大家心中的一些疑惑。 首先,618大促为什么如此重要呢?先从数据的角度简单做一下分析,以…

Arcgis根据经纬度获得点的地理信息/行政区划信息

步骤可以总结为: 导入shp文件(面数据,也就是行政区划的依据) 导入栅格数据 将栅格数据落入到坐标系中 将导入的栅格点导出为shp图层 栅格点与面数据连接对齐 导出结果 1、导入shp文件(面数据,也就是行…

去中心化的信任,Web3如何塑造更加牢固的客户忠诚度

在当今数字化的时代,客户忠诚度对于企业的成功至关重要。而随着Web3技术的崛起,我们正面临着一场信任的革命。本文将探讨Web3如何塑造更加牢固的客户忠诚度,并为企业带来长期的商业价值。 1.去中心化的信任机制 在传统的Web2模式下&#xff…

支付宝小程序开发

支付宝小程序商城是一种基于支付宝平台开发的小程序应用,它可以帮助商家在小程序中完成商品展示、下单购买、在线支付等操作。下面我们来介绍支付宝小程序商城的好处。 一、便捷快速 支付宝小程序商城可以直接在支付宝App中使用,无需下载和安装&#x…

InstructGPT:Training language models to follow instructions with human feedback

Training language models to follow instructions with human feedback 通过人类反馈的微调,在广泛的任务中使语言模型与用户的意图保持一致 aligning language models with user intent on a wide range of tasks by fine-tuning with human feedback 实验动机 …

【学习日记2023.6.12】之nacos配置管理_Feign远程调用_Gateway服务网关

文章目录 6. Nacos配置管理6.1 统一配置管理6.1.1 在nacos中添加配置文件6.1.2 从微服务拉取配置6.2 配置热更新 6.3 配置共享6.4 Nacos集群搭建6.4.1 集群结构图6.4.2 搭建集群初始化数据库下载nacos配置Nacos启动nginx反向代理优化 7. Feign远程调用7.1 Feign替代RestTemplat…

华为OD机试真题B卷 Java 实现【最少数量线段覆盖】,附详细解题思路

一、题目描述 给定坐标轴上的一组线段,线段的起点和终点均为整数并且长度不小于1,请你从中找到最少数量的线段,这些线段可以覆盖住所有线段。 二、输入描述 第一行输入为所有线段的数量,不超过10000,后面每行表示一条线段,格式为"x,y",x和y分别表示起点和终…