javascript - 在 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

再次令人敬畏:)