快捷導(dǎo)航

使用js實(shí)現(xiàn)單鏈解決前端隊(duì)列問(wèn)題的方法

更新時(shí)間：2020年02月03日 10:24:04 作者：starkwang

這篇文章主要介紹了使用js實(shí)現(xiàn)單鏈解決前端隊(duì)列問(wèn)題的方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

使用場(chǎng)景

比如前端需要處理什么隊(duì)列一類的業(yè)務(wù)
比如有人下單，需要彈出什么彈窗

首先先聲明一個(gè)類

接收一個(gè) 數(shù)組對(duì)象：items

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

為隊(duì)列添加數(shù)組隊(duì)列

// 添加數(shù)組隊(duì)列
entryArrQueue(node) {
 Array.isArray(node)
 node.map(item => this.items.push(item))
}

為當(dāng)前隊(duì)列添加單個(gè)對(duì)象

// 添加隊(duì)列
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)
 }
}

刪除隊(duì)列，返回刪除的當(dāng)前的項(xiàng)目

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

返回隊(duì)列的第一個(gè)

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

清除隊(duì)列

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
 }

 // 添加數(shù)組隊(duì)列
 entryArrQueue(node) {
  Array.isArray(node)
  node.map(item => this.items.push(item))
 }

 // 添加隊(duì)列
 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)
  }
 }

 // 刪除隊(duì)列，返回刪除的當(dāng)前的項(xiàng)目
 deleteQueue(func = () => {}) {
  assert(isFunc(func), `${func} is not function`)
  func(this.items.shift())
 }

 // 返回隊(duì)列的第一個(gè)
 front() {
  return this.items[0]
 }

 // 清除隊(duì)列
 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())

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

JavaScript閉包詳解
一分鐘理解JavaScript閉包，關(guān)于JavaScript閉包的內(nèi)容介紹了很多，本文帶著大家快速理解什么是JavaScript閉包，感興趣的小伙伴們可以參考一下
2021-10-10
淺析Javascript中雙等號(hào)(==)隱性轉(zhuǎn)換機(jī)制
這篇文章給大家詳細(xì)介紹了javascript中雙等號(hào)(==)隱性轉(zhuǎn)換機(jī)制，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧
2017-10-10
jsp+javascript打造級(jí)連菜單的實(shí)例代碼
jsp+javascript打造級(jí)連菜單的實(shí)例代碼，需要的朋友可以參考一下
2013-06-06
js中reverse函數(shù)的用法詳解
本篇文章主要是對(duì)js中reverse函數(shù)的用法進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2013-12-12
JavaScript自定義Webpack配置實(shí)現(xiàn)流程介紹
本系列主要整理前端面試中需要掌握的知識(shí)點(diǎn)。本節(jié)介紹webpack如何優(yōu)化前端性能，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2022-10-10
JS檢測(cè)window.open打開的窗口是否關(guān)閉
在開發(fā)中遇到需要在打開窗口的同時(shí)給父窗口添加遮罩防止用戶誤操作，而在窗口關(guān)閉時(shí)需要去掉父窗口的遮罩以便用戶操作。所以可以利用setInterval()來(lái)周期性的檢測(cè)打開的窗口是否關(guān)閉
2017-06-06
Javascript 虛擬 DOM詳解
這篇文章主要為大家介紹了Javascript 虛擬 DOM，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助
2021-12-12
JavaScript生成一個(gè)不重復(fù)的ID的方法示例
這篇文章主要介紹了JavaScript生成一個(gè)不重復(fù)的ID的方法示例,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-09-09
如何利用moment處理時(shí)間戳并計(jì)算時(shí)間的差值
前端很多場(chǎng)景都會(huì)涉及到對(duì)時(shí)間的處理,我所用得最多的庫(kù)是moment,下面這篇文章主要給大家介紹了關(guān)于如何利用moment處理時(shí)間戳并計(jì)算時(shí)間的差值的相關(guān)資料,需要的朋友可以參考下
2022-04-04
JavaScript?WeakMap的具體使用
本文主要介紹了JavaScript?WeakMap的具體使用，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2023-02-02