javascript调用具有相同上下文的函数数组

Question

我正在尝试创建一个回调函数，或者至少这是我如何命名它。主要目的是从具有相同上下文的数组中调用函数，并能够从当前正在执行的函数中调用数组中的下一个函数。

这是我想出了代码：

function callCallbackChain(context, callbackChain, params) { 
 
    callbackChain.push(function() { 
 
     return true; 
 
    }); 
 
    for (var i = 0, len = callbackChain.length - 1; i < len; i++) { 
 
     var cb = callbackChain[i]; 
 
     var next = callbackChain[i + 1]; 
 
     if (typeof cb === "function") { 
 
      cb.apply(context, [next].concat(params)); 
 
     } 
 
    } 
 
} 
 
var callbackChain = [ 
 
    function (next, foo) { 
 
     console.log('1 function call', arguments); 
 
     this.innerHTML = this.innerHTML + "function called + context:" + foo + "<br>"; 
 
     next() 
 
    }, 
 
    function (next, foo) { 
 
     console.log('2 function call', arguments); 
 
     this.innerHTML = this.innerHTML + "function called + context:" + foo + "<br>"; 
 
     next() 
 
    }, 
 
    function (next, foo) { 
 
     console.log('3 function call', arguments); 
 
     this.innerHTML = this.innerHTML + "function called + context:" + foo + "<br>"; 
 
     next() 
 
    } 
 
]; 
 

 

 
var d = document.querySelector("#conent"); 
 
callCallbackChain(d, callbackChain, ["param from the main function"]);

<div id="conent"> 
 
    Initial Content 
 
    
 
</div>

我似乎无法能够正确设置next功能。它就像一个中间件。

Answer 1

你next功能不能实际上是链中的一个功能。

它的目的是运行下一个功能。

function run(context, chain, params) { 
 
    var inner_run = (context, chain, params, index) => { 
 
    next =() => inner_run(context, chain, params, index + 1); 
 
    if (index < chain.length) chain[index].apply(context, [next].concat(params)); 
 
    }; 
 
    inner_run(context, chain, params, 0); 
 
} 
 

 
var chain = [ 
 
    function (next, foo) { 
 
    this.first = true 
 
    console.log('first', arguments); 
 
    next() 
 
    }, 
 
    function (next, foo) { 
 
    this.second = true 
 
    console.log('second', arguments); 
 
    // not calling next() 
 
    }, 
 
    function (next, foo) { 
 
    this.third = true 
 
    console.log('third', arguments); 
 
    next() 
 
    } 
 
]; 
 

 
var context = {}; 
 

 
run(context, chain, ["param"]); 
 

 
console.log('context', context);

Answer 2

你需要将它绑定在飞行：

var nextelem=0; 
function next(params...){ 
temp=nextelem; 
nextelem++; 
callbackChain[temp].bind(context)(next,...params); 
} 
//pass it 
nextelem=1; 
callbackChain[0].bind(context)(next);