javascript - JavaScript 执行顺序的正确解释

Question

我知道关于这个主题有很多问题，但所有问题都是针对特定案例量身定制的。我在问这个问题，并希望每个人在调查此事时都能使用的答案。

假设我有三个需要按顺序执行的函数，它们都做一些异步的事情。

对于两个函数，回调很简单：

var fOne = function(callback) {
  // do stuff
  callback();
};

var fTwo = function() {
  // do stuff
};

来电：

fOne(fTwo);

使 fTwo 在 fOne 完成后运行。如何将 fThree 添加到这种情况下，使其在 fTwo 之后运行，而 fTwo 在 fOne 之后运行？

Answer 1

基本上，如果我正确理解您的问题，您需要将 lambda 传递给 fOne，以便能够向 fTwo 添加参数，然后让 fTwo 收集回调并像 fOne 一样调用它。

var fOne = function(callback) {
  // do stuff
  callback();
};

var fTwo = function(callback) {
  // do stuff
  callback();
};

var fThree = function() {
  // do stuff
};

fOne(function() { fTwo(fThree); }); // <- lambda

Answer 2

One more approach I came up with:

var stack = [fOne, fTwo, fThree];
stack.shift()(function() {
    stack.shift()(stack[0]);
});

Where you define your functins as:

function fOne(callback) {
    setTimeout(function() { // <-- example of async task
        alert('fOne done');
        callback && callback();
    }, 1000);
}

http://jsfiddle.net/kRMr8/2/

Answer 3

由于您没有使用 deferred 和 promises 来同时运行异步操作，而是在另一个操作完成时才启动一个操作，因此添加第三个操作的方式几乎相同：

var fOne = function(callback) {
   console.log('1')
   callback();
};

var fTwo = function(callback) {
   console.log('2')
   callback();
};

var fThree = function() {
   console.log('3')
};

fOne(function() {
    fTwo(function() {
        fThree();
    });
});

小提琴