在Javascript中协调异步请求

Question

我想使用两个异步调用来获取两个资源.我想只在检索到两个资源时继续.

我怎样才能在JS中优雅地做到这一点？

这可行:

getStuff1(function (result1) {
    getStuff2 (function (result2) {
        // do stuff with result1 and result2
        ....
    }
}

但stuff2只在stuff1完成后才开始.我宁愿在等待stuff1时启动stuff2.

Answer 1

如果您知道函数实际上是Javascript中的第一类对象,那么您可以提出一个相当优雅的解决方案.

没有任何额外的对象或全局变量.

function callback1() {
  callback1.done = true;
  commonCallback();
}

function callback2() {
  callback2.done = true;
  commonCallback();
}

function commonCallback() {
  if (callback1.done && callback2.done) {
    // do stuff, since you know both calls have come back.
  }
}

为什么这么优雅？因为您已经封装了数据,所以您的范围没有无用的变量,代码比以往更具可读性.这有多酷？:)

UPDATE

如果您想要更通用的解决方案,您可以尝试以下方法:

function callback() {
  callback.number -= 1;
  if (callback.number === 0) {
    // do stuff since all calls finished
    callback.last();
  }
}
callback.newQueue = function(num, last) {
  callback.number = num;
  callback.last   = last;
}

// EXAMPLE USAGE

// our last function to be invoked
function afterEverythingDone(){ alert("done"); }

// create a new callback queue
callback.newQueue(3, afterEverythingDone);

// as time passes you call the callback
// function after every request
callback();
callback();
callback();

// after all call is finished
// afterEverythingDone() executes

太棒了:)