javascript - 在不使用 Promises 的情况下按顺序执行回调

Question

我正在尝试按实现函数 runCallbacksInSequence 的顺序执行以下函数数组(避免 callbackHell)(我需要实现自己的函数以了解回调如何工作并避免使用 Async.js) .这是我到目前为止所拥有的。我不太明白回调是如何工作的，这就是我做这个练习的原因。如果您有任何想法，请告诉我我做错了什么以及如何解决。

function first(cb) {
  console.log('first()');
  cb();
}
function second(cb) {
  console.log('second()');
  cb();
}
function third(cb) {
  console.log('third()');
  cb();
}
function last() {
  console.log('last()');
}

let fns = [first, second, third, last];

function runCallbacksInSequence(fns, cb) {
  return fns.reduceRight((acc, f) => f(acc), cb);
}

runCallbacksInSequence(fns, second);

回调 hell

// first(function() {
//   third(function() {
//     second(function() {
//       last();
//     });
//   });
// });

UPD

    const cache = {};

    function runCallbacksInSequence(fns, cb) {
      fns.reduce(
        function(r, f) {
          return function(k) {
            return r(function() {
              if (cache[f]) {
                return;
                // f(function(e, x) {
                //   e ? cb(e) : k(x);
                // });
              } else {
                cache[f] = f;
                return f(function(e, x) {
                  return e ? cb(e) : k(x);
                });
              }
            });
          };
        },
        function(k) {
          return k();
        }
      )(function(r) {
        return cb(null, r);
      });
    }

Answer 1

让 .reduce 回调成为一个高阶函数，当它被调用时，调用链中带有回调的下一个函数。最后，您将拥有一个函数链，首先调用第一个函数，然后调用第二个函数，依此类推:

function first(cb) {
  console.log('first()');
  cb();
}
function second(cb) {
  console.log('second()');
  cb();
}
function third(cb) {
  console.log('third()');
  cb();
}
function last() {
  console.log('last()');
}

let fns = [first, second, third, last];

function runCallbacksInSequence(fns, cb) {
  const chainedFns = fns.reduceRight((acc, f) => () => f(acc), cb);
  return chainedFns();
}

runCallbacksInSequence(fns);

如果您希望 runCallbacksInSequence 接受另一个回调以在所有回调结束时运行，那么:

function first(cb) {
  console.log('first()');
  cb();
}
function second(cb) {
  console.log('second()');
  cb();
}
function third(cb) {
  console.log('third()');
  cb();
}
function last(cb) {
  console.log('last()');
  cb();
}

let fns = [first, second, third, last];

function runCallbacksInSequence(fns, cb) {
  const chainedFns = fns.reduceRight((acc, f) => () => f(acc), cb);
  return chainedFns();
}

runCallbacksInSequence(fns, () => console.log('outer call'));