使用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 相关文章推荐
encode脚本和normal脚本混用的问题与解决方法
Mar 08 Javascript
理解JavaScript变量作用域更轻松
Oct 25 Javascript
JS通过分析userAgent属性来判断浏览器的类型及版本
Mar 28 Javascript
jquery单行文字向上滚动效果的实现代码
Sep 05 Javascript
js实现的彩色方块飞舞奇幻效果
Jan 27 Javascript
结合代码图文讲解JavaScript中的作用域与作用域链
Jul 05 Javascript
JS及JQuery对Html内容编码,Html转义
Feb 17 Javascript
如何在 Vue.js 中使用第三方js库
Apr 25 Javascript
node.js平台下利用cookie实现记住密码登陆(Express+Ejs+Mysql)
Apr 26 Javascript
Vue 页面跳转不用router-link的实现代码
Apr 12 Javascript
小程序如何使用分包加载的实现方法
May 22 Javascript
JS脚本实现定时到网站上签到/签退功能
Apr 22 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 防止单引号,双引号在接受页面转义
2008/07/10 PHP
PHP Ajax中文乱码问题解决方法
2009/02/27 PHP
使用配置类定义Codeigniter全局变量
2014/06/12 PHP
php正则修正符用法实例详解
2016/12/29 PHP
php分页查询mysql结果的base64处理方法示例
2017/05/18 PHP
php/JS实现的生成随机密码(验证码)功能示例
2019/06/06 PHP
jquery ready()的几种实现方法小结
2010/06/18 Javascript
jQuery jqgrid 对含特殊字符json 数据的 Java 处理方法
2011/01/01 Javascript
JavaScript根据数据生成百分比图和柱状图的实例代码
2013/07/14 Javascript
JavaScript SetInterval与setTimeout使用方法详解
2013/11/15 Javascript
C#中使用迭代器处理等待任务
2015/07/13 Javascript
举例讲解Node.js中的Writable对象
2015/07/29 Javascript
Bootstrap+jfinal退出系统弹出确认框的实现方法
2016/05/30 Javascript
jQuery快速实现商品数量加减的方法
2017/02/06 Javascript
Javascript 链式作用域详细介绍
2017/02/23 Javascript
利用Node.js+Koa框架实现前后端交互的方法
2017/02/27 Javascript
JS实现的简单四则运算计算器功能示例
2017/09/27 Javascript
JavaScript实现点击出现图片并统计点击次数功能示例
2018/07/23 Javascript
VUE解决 v-html不能触发点击事件的问题
2019/10/28 Javascript
微信小程序云函数添加数据到数据库的方法
2020/03/04 Javascript
package.json中homepage属性的作用详解
2020/03/11 Javascript
vue 使用 sortable 实现 el-table 拖拽排序功能
2020/12/26 Vue.js
vue使用过滤器格式化日期
2021/01/20 Vue.js
python计算圆周长、面积、球体体积并画出圆
2014/04/08 Python
Python深入学习之特殊方法与多范式
2014/08/31 Python
Windows安装Python、pip、easy_install的方法
2017/03/05 Python
Python基础之条件控制操作示例【if语句】
2019/03/23 Python
keras.utils.to_categorical和one hot格式解析
2020/07/02 Python
如何基于matlab相机标定导出xml文件
2020/11/02 Python
Python用户自定义异常的实现
2020/12/25 Python
南威尔士家居商店:Leekes
2016/10/25 全球购物
Sunglasses Shop丹麦:欧洲第一的太阳镜在线销售网站
2017/10/22 全球购物
经贸日语专业自荐信
2014/09/02 职场文书
2016年12月份红领巾广播稿
2015/12/21 职场文书
导游词之岳阳楼
2019/09/25 职场文书
《艾尔登法环》1.03.3补丁上线 碎星伤害调整
2022/04/07 其他游戏