一連のajaxリクエストの連鎖を自動化するにはどうすればよいですか？

Question

私の機能の下の部分を見てください：私はinfo(url_part1 + next + url_part2, function(next) {回繰り返すしたいです。下に示されているものよりスマートな方法がありますか？私は一日中考えてきましたが、私は何も工夫できません。

function info(link, callback) { 
     $.getJSON(link, function(json) { 
      $.each(json.data.children, function(i, things) { 
       $("#threadlist").append('<img src="' + things.data.url + '">'); 
      }); 
      callback(json.data.after); 
     }); 
    } 
    var url_first = "http://www.reddit.com/r/aww/.json?jsonp=?"; 
    var url_part1 = "http://www.reddit.com/r/aww/.json?after="; 
    var url_part2 = "&jsonp=?"; 

    info(url_first, function(next) { 
     info(url_part1 + next + url_part2, function(next) { 
      info(url_part1 + next + url_part2, function(next) { 
       info(url_part1 + next + url_part2, function(next) { 
        info(url_part1 + next + url_part2, function(next) { 

        }); 
       }); 
      }); 
     }); 
    }); 

のJSフィドル：http://jsfiddle.net/rdUBD/1/

Answer 1

そのような何か：

http://jsfiddle.net/JwAbK/

Answer 2

あなたは再帰的にそれらの処理を検討する必要があります。たぶん

function processRequest(request) 
{ 
     $.getJSON(request,function(json) { 
      // process json 
      if (json.data.after) { 
      processRequest("http://www.reddit.com/r/aww/.json?after=" 
           + json.data.after 
           + "&jsonp=?"); 
      } 
     }); 
} 

processRequest("http://www.reddit.com/r/aww/.json?jsonp=?"); 

Answer 3

私が正しく理解していれば、あなたがしたいすべてが一定回数までは、再帰関数を呼び出しているようです。ここではまさにそのサンプルコードです：

function testFunction(number, callback) { 
    document.writeln("testFunction() called with number = " + number + "<br />"); 
    callback(number + 1); 
} 

var CallCount = 0; 
testFunction(1, function(next) { 
    CallCount++; 
    document.writeln("callback called next = " + next + "<br />"); 

    if(CallCount == 5) { 
     document.writeln("callback called 5 times, don't call it again"); 
    } else { 
     testFunction(next, arguments.callee); 
    } 
}); 

はその次のコードを出力します

testFunction() called with number = 1 
callback called next = 2 
testFunction() called with number = 2 
callback called next = 3 
testFunction() called with number = 3 
callback called next = 4 
testFunction() called with number = 4 
callback called next = 5 
testFunction() called with number = 5 
callback called next = 6 
callback called 5 times, don't call it again 

あなたはjFiddleでそれを試してみることができます：http://jsfiddle.net/luisperezphd/NQya6/

は、あなたが得るあなたのコードにこれを適用します：

var DebugCount = 0; 
function EmulateGetJson(link, callback) { 
    DebugCount++; 
    callback({ 
     data: { 
      children: [ 
       { data : { url: "https://www.google.com/images/srpr/logo3w.png?" + DebugCount, next: "next" } } 
      ] 
     } 
    }); 
} 

function info(link, callback) { 
    //$.getJSON(link, function(json) { 
    EmulateGetJson(link, function(json) { 
     $.each(json.data.children, function(i, things) { 
      $("#threadlist").append('<img src="' + things.data.url + '">'); 
     }); 
     callback(json.data.after); 
    }); 
} 

var url_first = "http://www.reddit.com/r/aww/.json?jsonp=?"; 
var url_part1 = "http://www.reddit.com/r/aww/.json?after="; 
var url_part2 = "&jsonp=?"; 

var CallCount = 0; 
var TargetCallCount = 5; 
info(url_first, function(next) { 
    CallCount++; 

    if(CallCount != TargetCallCount) { 
     info(url_part1 + next + url_part2, arguments.callee); 
    } 
}); 

この場合のjsFiddleは、にあります。 210

完全な例を提供するために、JavaScriptコードで$.getJSONへの呼び出しをエミュレートしました。毎回異なるURLが返されていることを示すために、サンプル画像のURLの末尾に数字を追加しました。

arguments.calleeは、現在の関数を指します。この場合は、コールバックとしてinfo()に渡す関数がこれを再帰のキーにします。