小編給大家分享一下JS如何實(shí)現(xiàn)異步函數(shù)隊(duì)列功能，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)建站10多年成都定制網(wǎng)頁(yè)設(shè)計(jì)服務(wù);為您提供網(wǎng)站建設(shè),網(wǎng)站制作,網(wǎng)頁(yè)設(shè)計(jì)及高端網(wǎng)站定制服務(wù),成都定制網(wǎng)頁(yè)設(shè)計(jì)及推廣,對(duì)主動(dòng)防護(hù)網(wǎng)等多個(gè)領(lǐng)域擁有豐富的網(wǎng)站推廣經(jīng)驗(yàn)的網(wǎng)站建設(shè)公司。

具體如下：

場(chǎng)景：

做直播，會(huì)有入場(chǎng)消息，入場(chǎng)特效，用戶(hù)如果有坐騎，需要給他展示幾秒鐘的坐騎特效，如果幾個(gè)人同時(shí)進(jìn)場(chǎng)，那該怎么展示呢？這時(shí)候就會(huì)想到setTimeout函數(shù)，對(duì)，思路不錯(cuò)，但是，異步函數(shù)隊(duì)列怎么實(shí)現(xiàn)呢？直接上代碼：

var Queue = function() {
    this.list = [];
};
Queue.prototype = {
    constructor: Queue,
    queue: function(fn) {
      this.list.push(fn)
      return this;
    },
    wait: function(ms) {
      this.list.push(ms)
      return this;
    },
    dequeue: function() {
      var self = this,
        list = self.list;
      self.isdequeue = true;
      var el = list.shift() || function() {};
      if (typeof el == "number") {
        setTimeout(function() {
          self.dequeue();
        }, el);
      } else if (typeof el == "function") {
        el.call(this)
        if (list.length) {
          self.dequeue();
        } else {
          self.isdequeue = false;
        }
      }
    }
};

例子：

如果a,b差不多同時(shí)進(jìn)來(lái)；
c在a,b還沒(méi)完全出隊(duì)列的時(shí)候，進(jìn)來(lái)的；
d在a,b,c都除了隊(duì)列之后再進(jìn)來(lái)的。

var q = new Queue();
function a() {
    console.log("a執(zhí)行了", new Date());
}
function b() {
    console.log("b執(zhí)行了", new Date());
}
function c() {
    console.log("c執(zhí)行了", new Date());
}
function d() {
    console.log("d執(zhí)行了", new Date());
}
q.wait(2000);
q.queue(a);
q.wait(2000);
q.queue(b);
q.dequeue();
setTimeout(function(){//3S之后進(jìn)來(lái)的
    q.wait(2000);
    q.queue(c);
},3000);
setTimeout(function(){//8S之后進(jìn)來(lái)的
    q.wait(2000);
    q.queue(d);
    q.dequeue();
},8000);

這里我們就需要判斷什么時(shí)候要調(diào)用dequeue來(lái)出隊(duì)列了。（為什么c進(jìn)隊(duì)列的時(shí)候，不需要dequeue，但是d進(jìn)來(lái)的時(shí)候就需要dequeue了呢？）

但是一般我們是無(wú)法知道用戶(hù)什么時(shí)候進(jìn)場(chǎng)的，一般都是進(jìn)隊(duì)列了，就該能出隊(duì)列，但是如果用戶(hù)是在空隊(duì)列的時(shí)候進(jìn)來(lái)的，之前的遞歸調(diào)用dequeue就執(zhí)行完了，你進(jìn)來(lái)需要再執(zhí)行 出隊(duì)列的操作。

于是，代碼應(yīng)該這樣：

var q = new Queue();
  function a() {
    console.log("a執(zhí)行了", new Date());
  }
  function b() {
    console.log("b執(zhí)行了", new Date());
  }
  function c() {
    console.log("c執(zhí)行了", new Date());
  }
  function d() {
    console.log("d執(zhí)行了", new Date());
  }
  q.wait(2000);
  q.queue(a);
  if (!q.isdequeue) {
    q.dequeue();
  }
  q.wait(2000);
  q.queue(b);
  if (!q.isdequeue) {
    q.dequeue();
  }
  setTimeout(function() { //3S之后進(jìn)來(lái)的
    q.wait(2000);
    q.queue(c);
    if (!q.isdequeue) {
      q.dequeue();
    }
  }, 3000);
  setTimeout(function() { //8S之后進(jìn)來(lái)的
    q.wait(2000);
    q.queue(d);
    if (!q.isdequeue) {
      q.dequeue();
    }
  }, 8000);

這樣，每進(jìn)一次隊(duì)列，就判斷要不要出隊(duì)列，事情就OK了。

以上是“JS如何實(shí)現(xiàn)異步函數(shù)隊(duì)列功能”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司行業(yè)資訊頻道！

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無(wú)理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性?xún)r(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專(zhuān)為企業(yè)上云打造定制，能夠滿(mǎn)足用戶(hù)豐富、多元化的應(yīng)用場(chǎng)景需求。

名稱(chēng)欄目：JS如何實(shí)現(xiàn)異步函數(shù)隊(duì)列功能-創(chuàng)新互聯(lián)
標(biāo)題URL：http://chinadenli.net/article20/dgpoco.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供企業(yè)網(wǎng)站制作、微信公眾號(hào)、網(wǎng)站設(shè)計(jì)公司、品牌網(wǎng)站制作、搜索引擎優(yōu)化、微信小程序

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)