使用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 相关文章推荐
flexigrid 类似ext grid的JS表格代码
Jul 17 Javascript
基于jQuery的message插件实现右下角弹出消息框
Jan 11 Javascript
JavaScript mapreduce工作原理简析
Nov 25 Javascript
jquery Ajax 实现加载数据前动画效果的示例代码
Feb 07 Javascript
三种动态加载js的jquery实例代码另附去除js方法
Apr 30 Javascript
用javascript实现自动输出网页文本
Jul 30 Javascript
js+canvas简单绘制圆圈的方法
Jan 28 Javascript
Bootstrap中的表单验证插件bootstrapValidator使用方法整理(推荐)
Jun 21 Javascript
解决Angular.js中使用Swiper插件不能滑动的问题
Feb 26 Javascript
GOJS+VUE实现流程图效果
Dec 01 Javascript
一个因@click.stop引发的bug的解决
Jan 08 Javascript
JavaScript字符和ASCII实现互相转换
Jun 03 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中读写文件实现代码
2011/10/20 PHP
ThinkPHP页面跳转success与error方法概述
2014/06/25 PHP
PHP 返回13位时间戳的实现代码
2016/05/13 PHP
PHP递归实现汉诺塔问题的方法示例
2017/11/25 PHP
javascript支持firefox,ie7页面布局拖拽效果代码
2007/12/20 Javascript
window.onload 加载完毕的问题及解决方案(下)
2009/07/09 Javascript
理解JSON:3分钟课程
2011/10/28 Javascript
js constructor的实际作用分析
2011/11/15 Javascript
jquery实现弹出窗口效果的实例代码
2013/11/28 Javascript
JS封装的三级联动菜单(使用时只需要一行js代码)
2016/10/24 Javascript
JavaScript实现经典排序算法之选择排序
2016/12/28 Javascript
获取url中用&隔开的参数实例(分享)
2017/05/28 Javascript
微信小程序实现提交input信息到后台的方法示例
2019/01/19 Javascript
深入探讨JavaScript的最基本部分之执行上下文
2019/02/12 Javascript
小程序实现分类页
2019/07/12 Javascript
JS 数组基本用法入门示例解析
2020/01/16 Javascript
vue中对象数组去重的实现
2020/02/06 Javascript
使用Python3编写抓取网页和只抓网页图片的脚本
2015/08/20 Python
Python利用前序和中序遍历结果重建二叉树的方法
2016/04/27 Python
django利用request id便于定位及给日志加上request_id
2018/08/26 Python
基于pycharm导入模块显示不存在的解决方法
2018/10/13 Python
Python实现的字典排序操作示例【按键名key与键值value排序】
2018/12/21 Python
python实现将中文日期转换为数字日期
2020/07/14 Python
基于Django集成CAS实现流程详解
2020/11/28 Python
一文带你了解Python 四种常见基础爬虫方法介绍
2020/12/04 Python
Python使用pyenv实现多环境管理
2021/02/05 Python
python中threading和queue库实现多线程编程
2021/02/06 Python
BRASTY捷克:购买香水、化妆品、手袋和手表
2017/07/12 全球购物
Wallis官网:英国女装零售商
2020/01/21 全球购物
幸福家庭事迹材料
2014/02/03 职场文书
《母亲的恩情》教学反思
2014/02/13 职场文书
薪酬专员岗位职责
2014/02/18 职场文书
村长贪污检举信
2014/04/04 职场文书
中国梦演讲稿教师篇
2014/04/23 职场文书
基层党员干部四风问题整改方向和措施
2014/09/25 职场文书
Python机器学习之基础概述
2021/05/19 Python