JQuery/Ajaxとwhen/done/promise confusion

Question

私は次のことを達成しようとしています： 1）何らかのソースを取得して「何かでそれをやってください」。 2）データを他のソースから取得し、「何かを行う」。 3）データフェッチは、優先的に非同期で実行する必要があります（同時に、2番目のフェッチは最初のものが完了するのを待つべきではありません）。 4）両方が完了すると、ビジネスロジックが実行されますが、完了した時点でのみ実行されます。

私はこれがうまくいくと思っていたことを示すために小さなJSFiddleを作成しましたが、残念ながらそれはしません。 a）データ取り出し呼び出しは順番に実行されます。すべてのヘルプ高く評価されてどのような構造があるべき片付けhttps://jsfiddle.net/LeifFrederiksen/emttmhm7/

$.when(
    getOneThing(), 
    getAnotherThing() 
).done(
    function() { 
     console.log("Got it all"); 
     $("#Output").append("<BR>Got it all"); 
    } 
); 

function getOneThing() { 
    commonFunctionToGetStuff("oneKindOfThings",renderOneKindOfThings); 
} 

function getAnotherThing() { 
    commonFunctionToGetStuff("anotherKindOfThings",renderAnotherKindOfThings); 
} 

function commonFunctionToGetStuff (listTitle,successFunction) { 
    var url = "https://httpbin.org/get"; 

    $.ajax({ 
     url: url, 
     type: "GET", 
     headers: { "accept": "application/json;odata=verbose" } 
    }).success(function (data) { 
     console.log("Calling renderfunction for " + listTitle); 
     $("#Output").append("<BR>Calling renderfunction for " + listTitle); 
     successFunction(data); 
     console.log("Back from renderfunction for " + listTitle); 
     $("#Output").append("<BR>Back from renderfunction for " + listTitle); 
    }); 
} 

function renderOneKindOfThings(data) { 
    // Do something with the data... 
    console.log("Doing oneKindOfThings."); 
    $("#Output").append("<BR>Doing oneKindOfThings."); 
} 

function renderAnotherKindOfThings(data) { 
    // Do something with the data... 
    console.log("Doing anotherKindOfThings."); 
    $("#Output").append("<BR>Doing anotherKindOfThings."); 
} 

：datafetchingも...ここに

フィドルを開始しました前 b）は、上記のステップ4からビジネス・ロジックが実行されます。

実際のAjax呼び出しを実行する関数が一般的な種類の構造を維持する必要があります。使用するデータソースを制御するパラメータを持つ単純なラッパー関数によって呼び出すことができます。例:-)

あなたの commonFunctionToGetStuff -methodとそれを呼び出すメソッドからの約束を返す必要が

よろしく レイフ

Answer 1

。それ以外の場合は、undefinedをwhen -functionに渡しています。この関数はdone-callbackを直ちに実行します。また、いくつかの誤ったコールバック名（doneまたはthenではなく、success）があります。

function getOneThing() { 
    return commonFunctionToGetStuff("oneKindOfThings",renderOneKindOfThings); 
} 

function getAnotherThing() { 
    return commonFunctionToGetStuff("anotherKindOfThings",renderAnotherKindOfThings); 
} 

function commonFunctionToGetStuff (listTitle,successFunction) { 
    var url = "https://httpbin.org/get"; 

    return $.ajax({...}) 
      .then(function (data) { ...}); 
}