异步请求链接

I'm looking for advice on extending a previous accepted answer regarding chained ajax requests.

The following asynchronous-chain solution was proposed to sequence 3 ajax requests:

var step_3 = function() {
    c.finish();
};

var step_2 = function(c, b) {
    ajax(c(b.somedata), step_3);
};

var step_1 = function(b, a) {
  ajax(b(a.somedata), step_2);
};

ajax(a, step_1);

This is great for a small pre-determined number of chained ajax functions but does not scale well to the case of a variable number of such functions.

I've tried doing the following but seem to run into scoping issues due my admitted lack of javascript expertise:

var asynch      = function (options, fNext) {// do something asynchronously} 
var chain       = {f:[]} // chain of asynchronous functions
var args        = function(n){ //return arguments to feed n'th asynch function }
for (n=0;n<N;n++) 
{
    var a       = args(n);
    var ftmp    = n==N-1? function(){} : chain.f[n+1]
    chain.f[n]  = function () {asynch(a, ftmp)}
}
chain.f[0]()  // initiate asynchronous chain

Asynchronous loops are a pain in the ass. As a rule of thumb, if you want to do them by hand you need to rewrite the for loop as a recursive function.

function sequence_synchronous(steps){
  for(var i=0; i<steps.length; i++){
    steps[i]();
  }
  return;
}


function sequence_async(steps, callback){
  var i = 0;
  var next_step = function(){
    if(i >= steps.length){
       callback();
    }else{
       steps[i](function(){
          i++;
          next_step();
       });
    }
  }
  next_step();
}

Note that this doesn't attempt to build a big chain of callbacks before calling the first one - all we did was convert the traditional for loop into continuation passing style.

I would highly recommend looking for a library to do this for you though.

What you have is a very common scoping issue with for loops. Each iteration of the for loop is using the same local scope as the parent function, meaning anything that happens asynchronously will end up accessing the last value of the loop rather than the value at the time it was defined. See this fiddle as an example: http://jsfiddle.net/GAG6Q/ Instead of asynch getting called 9 times, it gets called once with a value of 9. You can fix it by simply providing a private scope for the inside of the loop. You'll also want to wrap chain.f[n+1] in a function so that you don't try to assign undefined to ftmp.

http://jsfiddle.net/GAG6Q/1/

var N = 10;
var asynch      = function (options, fNext) {
    console.log(options);
    setTimeout(fNext,500);
}// do something asynchronously} 
var chain       = {f:[]} // chain of asynchronous functions
var args        = function(n){return n;} //return arguments to feed n'th asynch function }
for (n=0;n<N;n++) 
{
    (function(n){
        var a       = args(n);
        var ftmp    = n==N-1? function(){} : function(){chain.f[n+1]();};
        chain.f[n]  = function () {asynch(a, ftmp)}
    })(n);
}
chain.f[0]()  // initiate asynchronous chain