如何跟踪回调中的超时

时间:2014-06-23 22:21:29

标签: javascript timer

假设我有这段代码,我想知道所有回调何时完成。我该怎么做?

var cb1 = function() {


setTimeout(function() {
    console.log('cb1 fired');
  }, Math.random() * 1000);
};

var cb2 = function() {
  setTimeout(function() {
    console.log('cb2 fired');
  }, Math.random() * 1000);
};
var cb3 = function() {
  setTimeout(function() {
    console.log('cb3 fired');
  }, Math.random() * 1000);
};

function fireCBs(cbArray) {
}

fireCBs([cb1, cb2, cb3]);

1 个答案:

答案 0 :(得分:0)

首先,我不会像你一样重复代码。每个函数用随机间隔调用set timeout。因此,您可以简化代码。下面是代码的基本简化,允许您修改在一个地方调用setTimeout的方式。此外,它标准化了每个CB的功能。最后,我将Timeout period添加为TimeoutFunctions的属性,允许您自定义超时时间。

var Utilities = {
  TimeoutFunctions: [
    {
      timeoutPeriod: null,
      fn: function() {
        console.log("cb1 fired");
      }
    },
    {
      timeoutPeriod: null,
      fn: function() {
        console.log("cb2 fired");
      }
    },
    {
      timeoutPeriod: null,
      fn: function() {
        console.log("cb3 fired");
      }
    }
  ],
  fireCBs: function() {
    Utilities.totalCBsFired = Utilities.TimeoutFunctions.length;
    for (var i=0; i < Utilities.TimeoutFunctions.length; i++) {
      setTimeout((function(fn){
        return function () {
          fn();
          Utilities.totalCBsFired --;
          if (Utilities.totalCBsFired == 0) {
            //Execute your extra code here
            console.log("all cbs fired");
          }
        };
      })(Utilities.TimeoutFunctions[i].fn),
      Utilities.TimeoutFunctions[i].timeoutPeriod || (Math.random() * 1000));
    }
  }
}

Utilities.fireCBs();

确定测试了代码及其工作原理。这是一个工作小提琴http://jsfiddle.net/esqJ5/