6

サーバーにajax呼び出しを行っています。実行する必要のあるコードは、3つのグループに分けることができます。

  1. ajax呼び出しが行われる前に実行する必要のあるコード(サーバーに送信されるjsonオブジェクトの準備)
  2. ajax呼び出しが戻った後に実行する必要があるコード(サーバーから返送されたものを使用)
  3. ユーザーがボタンを押してからすべてが完了するまでの間に実行する必要のあるコード。このコードには、返されたjsonオブジェクトは必要ありません。

最高のユーザーエクスペリエンスとパフォーマンスを得るには、ajax呼び出しを行った後、結果が返される前に、グループ3でコードを実行することが理想的です。

これはできますか?

どのように?

4

2 に答える 2

11

非常に簡単です:

function someFunction() {
    //1. code that needs to run before ajax
    $.ajax({...}).done(function () {
        //2. code that needs to be run after the ajax call has returned
    });
    //3. code that needs to be run between the time the user presses
    //   a button and the time everything is done.
}

これは、JavaScriptの実行が同期しているために機能します(ワーカーが使用されている場合を除きますが、これはこの特定の問題とは関係ありません)。コードの最初のビットが実行され、次にajax呼び出しがブラウザーにXHR要求を開始するように指示しますが、someFunction終了していないため、同期的に実行を継続します。

完了someFunctionすると、制御フローは発生する非同期イベントに対して開かれ、最終的にはdoneコールバックにつながります。

公平を期すために、非同期のイベント指向プログラミングは、ほとんどの人が頭を悩ませるのは簡単ではありません。どのコードがいつ発生するかを見失いがちです。

非同期動作がどのように機能するかを簡単に実行できる例を次に示します。

(function () {
    alert(1);
    setTimeout(function () {
        alert(2);
    }, 0); //note the 0ms delay
    alert(3);
}());

アラートの順序は、、、に1なり3ます2setTimeout指定された時間が経過するのを待つことに依存しているため、コールバックを同期的に呼び出すことはありません。したがって、時間が経過しない場合でも、現在の関数が終了するのを待ってから続行する必要があります。

于 2012-11-17T01:23:13.060 に答える
0

クライアントイベントに反応するとき、またはその他のシナリオでajax呼び出しを実行すると、コールバックでコードを指定したり、ajaxコードが作成された直後に実行されるコード(コールバックではない)を指定したりできます。

例:

// Code before the ajax call is made
$.ajax({
    params, //other key values such as data
    success: function (data) {
       // one of the possible callbacks
    }
});
// Code executed immediately after ajax call is performed
// This is executed before or after the callback is complete
// In most cases it's before

したがって、ajax呼び出しが行われる前に実行されたものはすべて、前に実行されることが保証されます。ajax呼び出しの直後は、コールバックが呼び出される前に実行されることがほぼ保証されています。サーバーが応答を返した後、コールバックが実行されることが保証されています。

于 2012-11-17T01:22:53.987 に答える