使用js实现单链解决前端队列问题的方法


Posted in Javascript onFebruary 03, 2020

使用场景

  • 比如前端需要处理什么队列一类的业务
  • 比如有人下单,需要弹出什么弹窗

首先先声明一个类

接收一个 数组对象:items

class ChainQueue {
 constructor(items) {
  this.items = items || []
  this.maxNum = 200
 }
}

为队列添加数组队列

// 添加数组队列
entryArrQueue(node) {
 Array.isArray(node)
 node.map(item => this.items.push(item))
}

为当前队列添加单个对象

// 添加队列
entryQueue(node) {
 if (this.items.length > this.maxNum) {
  return
 }
 if (Array.isArray(node)) {
  node.map(item => this.items.push(item))
 } else {
  this.items.push(node)
 }
}

删除队列,返回删除的当前的项目

deleteQueue(func = () => {}) {
 assert(isFunc(func), `${func} is not function`)
 func(this.items.shift())
}

返回队列的第一个

front() {
 return this.items[0]
}

清除队列

clear() {
 this.items = []
}

所有代码

const isFunc = v => typeof v === 'function'
const assert = (condition, msg) => {
 if (!condition) throw new Error(`[dashboard]${msg}`)
}
class ChainQueue {
 constructor(items) {
  this.items = items || []
  this.maxNum = 200
 }

 // 添加数组队列
 entryArrQueue(node) {
  Array.isArray(node)
  node.map(item => this.items.push(item))
 }

 // 添加队列
 entryQueue(node) {
  if (this.items.length > this.maxNum) {
   return
  }
  if (Array.isArray(node)) {
   node.map(item => this.items.push(item))
  } else {
   this.items.push(node)
  }
 }

 // 删除队列,返回删除的当前的项目
 deleteQueue(func = () => {}) {
  assert(isFunc(func), `${func} is not function`)
  func(this.items.shift())
 }

 // 返回队列的第一个
 front() {
  return this.items[0]
 }

 // 清除队列
 clear() {
  this.items = []
 }
 get size() {
  return this.items.length
 }

 get isEmpty() {
  return !this.items.length
 }

 print() {
  console.log(this.items.toString())
  console.log(this.items)
 }
 result() {
  return this.items
 }
}

module.exports = ChainQueue

// export default ChainQueue
// export default (ChainQueue = new ChainQueue())

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一个简单的javascript类定义例子
Sep 12 Javascript
使用JavaScript的ActiveXObject对象检测应用程序是否安装的方法
Apr 15 Javascript
jquery网页回到顶部效果(图标渐隐,自写)
Jun 16 Javascript
JavaScript实现鼠标点击后层展开效果的方法
May 13 Javascript
js带缩略图的图片轮播效果代码分享
Sep 14 Javascript
原生javascript实现解析XML文档与字符串
Mar 01 Javascript
javascript设置文本框光标的方法实例小结
Nov 04 Javascript
简单谈谈gulp-changed插件
Feb 21 Javascript
微信小程序实现带刻度尺滑块功能
Mar 29 Javascript
详解Vue中localstorage和sessionstorage的使用
Dec 22 Javascript
JS实现动态生成html table表格的方法分析
Jul 11 Javascript
js全屏事件fullscreenchange 实现全屏、退出全屏操作
Sep 17 Javascript
javscript 数组扁平化的实现
Feb 03 #Javascript
Vue强制组件重新渲染的方法讨论
Feb 03 #Javascript
JavaScript中的类型检查
Feb 03 #Javascript
Vue的Eslint配置文件eslintrc.js说明与规则介绍
Feb 03 #Javascript
压缩Vue.js打包后的体积方法总结(Vue.js打包后体积过大问题)
Feb 03 #Javascript
24个解决实际问题的ES6代码片段(小结)
Feb 02 #Javascript
浅谈vuex为什么不建议在action中修改state
Feb 02 #Javascript
You might like
PHP实现文件安全下载
2006/10/09 PHP
php实现网页缓存的工具类分享
2015/07/14 PHP
thinkPHP中U方法加密传递参数功能示例
2018/05/29 PHP
浅析PHP中json_encode与json_decode的区别
2020/07/15 PHP
浅谈JavaScript编程语言的编码规范
2011/10/21 Javascript
js实现简单登录功能的实例代码
2013/11/09 Javascript
wap图片滚动特效无css3元素纯js脚本编写
2014/08/22 Javascript
浅谈JavaScript中的字符编码转换问题
2015/07/07 Javascript
JS实现可拖曳、可关闭的弹窗效果
2015/09/26 Javascript
13个PHP函数超实用
2015/10/21 Javascript
js事件驱动机制 浏览器兼容处理方法
2016/07/23 Javascript
基于JavaScript实现鼠标箭头移动图片跟着移动
2016/08/30 Javascript
自己封装的一个简单的倒计时功能实例
2016/11/23 Javascript
浅谈Node.js ORM框架Sequlize之表间关系
2017/07/24 Javascript
ionic 3.0+ 项目搭建运行环境的教程
2017/08/09 Javascript
node koa2 ssr项目搭建的方法步骤
2020/12/11 Javascript
[02:46]解说DC:感谢430陪伴我们的DOTA2国际邀请赛岁月
2016/06/29 DOTA
[49:35]KG vs SECRET 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
python通过scapy获取局域网所有主机mac地址示例
2014/05/04 Python
python批量提取word内信息
2015/08/09 Python
详解Python中的__new__、__init__、__call__三个特殊方法
2016/06/02 Python
快速了解Python中的装饰器
2018/01/11 Python
python判断输入日期为第几天的实例
2018/11/13 Python
Python模块的加载讲解
2019/01/15 Python
python 多进程队列数据处理详解
2019/12/23 Python
Python如何向SQLServer存储二进制图片
2020/06/08 Python
如何查看python关键字
2021/01/17 Python
乐高瑞士官方商店:LEGO CH
2020/08/16 全球购物
高校毕业生登记表自我鉴定
2013/11/03 职场文书
研究生简历自我评价范文
2014/09/13 职场文书
骨干教师个人总结
2015/02/11 职场文书
工会文体活动总结
2015/05/07 职场文书
详解Java七大阻塞队列之SynchronousQueue
2021/09/04 Java/Android
面试分析分布式架构Redis热点key大Value解决方案
2022/03/13 Redis
python模拟浏览器 使用selenium进入好友QQ空间并留言
2022/04/12 Python
SpringBoot使用ip2region获取地理位置信息的方法
2022/06/21 Java/Android