Question

我试图通过这样做来消除“DOOM的回调金字塔”：

$$( //my function
  function(next) { // <- next is the next function
    setTimeout(next,1000); // simple async function
  },

  function(next){ // this function is the previous's function "next" argument
    waitForSomethingAndReturnAValue(next, "I am a parameter!");
  },

  function(aValue){
    console.log("My value is:" + aValue);
  }
);

但我已经摆弄了大约一个小时，我的代码不起作用，有什么帮助吗？这是我到目前为止所得到的：

function $$(){
  for (a in arguments){
    arguments[a] = function(){
      arguments[a](arguments[Math.max(-1, Math.min(a+1, arguments.length-1))]);
    };
  }
  arguments[0]();
}

Answer 1

这样的工作：

function $$() {
    if (arguments.length <= 0) return;
    var args = Array.prototype.slice.call(arguments); // convert to array

    arguments[0](function () { $$.apply(null, args.slice(1)); });
}

$$(function(next) { alert("one"); next() }, function (next) { alert("two"); next() });

http://jsfiddle.net/Cz92w/

Answer 2

你可以试试这个：

function $$(){
    var i=0, ret, args = [].slice.call(arguments);
    var obj = {
        next: function() {
            ret = args[i++].call(obj, ret);
        }
    };
    obj.next();
}

并像这样使用它：

$$(
    function() {
        console.log(Date() + ' - Function 1');
        setTimeout(this.next, 1e3); // simple async function
    },
    function(){
        console.log(Date() + ' - Function 2');
        return waitForSomethingAndReturnAValue(this.next, "I am a parameter!");
    },
    function(aValue){
        console.log(Date() + ' - Function 3');
        console.log("My value is:" + aValue);
    }
);
function waitForSomethingAndReturnAValue(callback, param) {
    setTimeout(callback, 2e3);
    return param + param;
}

基本上，每个函数的返回值作为参数传递给下一个函数。对下一个函数的引用是this.next。

JS按顺序执行函数，同时将下一个函数作为参数传递

2 个答案: