範囲と注文AJAXコールバック

Question

このコードでは、1）ユーザーがオンラインかどうかを確認する2）わずかに異なるURLから情報を取得する、3）HTMLに両方を出力する必要があります。それはうまくいくが、一貫性がない。場合によっては、HTMLを出力するための関数を実行しているときに、最初の要求（オンラインかどうか）からのデータは定義されていません。現在、streamDataとuserDataはグローバルです。しかし、私はそれがなくても働くことができればいいと思う。両方のデータソースを一度に同じ場所で常に利用できるようにすることに問題があります。今

var getOnline = function(){ 
    for (var i = 0; i < twitchFaves.length; i++) { 
     userName = twitchFaves[i]; 
     streamAjaxOnline(userName); 
    } 
    } 
    var streamAjaxOnline = function(userName){ 
    $.ajax({ 
     type  : 'GET', 
     url   : "https://wind-bow.gomix.me/twitch-api/streams/" + userName, 
     dataType : 'jsonp', 
     success  : function(twitchData) { 

     streamData = twitchData; 
     if (streamData.stream){ 
      userAjaxOnline(userName); 
     } 
     } 
    }); 
    } 
    var userAjaxOnline = function(userName){ 
    $.ajax({ 
     type  : 'GET', 
     url   : "https://wind-bow.gomix.me/twitch-api/users/" + userName, 
     dataType : 'jsonp', 
     success  : function(twitchData) { 
     userData = twitchData; 
     displayTwitchOnline(streamData, userData); 
     } 
    }); 
    } 

Answer 1

ストリームデータ、およびuserDataは本当に悪いですグローバル

です。これは、関数への複数の呼び出しが同じ変数を共有し、お互いの結果を上書きすることを意味します。

しかし、私はそれがなくても動作するようにしたいと思います。

これは比較的簡単です。代わりに関数にデータを渡します。非常に単純な解決策は次のようになります：

var streamAjaxOnline = function(userName) { 
    $.ajax({ 
    type: 'GET', 
    url: "https://wind-bow.gomix.me/twitch-api/streams/" + userName, 
    dataType: 'jsonp', 
    success: function(twitchData) { 
     if (streamData.stream) { 
     userAjaxOnline(userName, streamData); // pass streamData here 
     } 
    } 
    }); 
} 
var userAjaxOnline = function(userName, streamData) { // accept streamData here 
    $.ajax({ 
    type: 'GET', 
    url: "https://wind-bow.gomix.me/twitch-api/users/" + userName, 
    dataType: 'jsonp', 
    success: function(twitchData) { 
     // no need to store userData if you only use it here 
     displayTwitchOnline(streamData, twitchData); 
    } 
    }); 
}