Javascript非同期実行手順解決案


実例分析:
例えば、怠け者ローディングを実行する時に、Oscrollイベントが何回かトリガされた時に、ajaxコールバックイベントが何回も呼び出されます。各イベントは先着順に戻り、トリガ前と一致しないため、データ応答が戻った後に追加されたデータの順序はpushから配列上で順序が一致しません。
例1:

var res = [];
   function response(data) {
     res.push( data );
}
// ajax(..)          Ajax   
ajax( "http://some.url.1", response ); 
ajax( "http://some.url.2", response );
ここでの同時進行プロセスは、Ajax応答を処理するためのレスポンスレスポンスの二つの呼び出しです。それらは任意の順序で動作します。
私たちが望む行動は、res[0]の呼び出しと仮定します。http://some.url.1"の結果、レスポンス[1]で呼び出します。"http://some.url.2という結果になりました。ある時はそうかもしれませんが、ある時は反対です。これはどの呼び出しが先に完了するかによって決まります。
このような不確実性は競合状態条件のバグである可能性が高い。
解決策

var res = [];
function response(data) {
     if (data.url == "http://some.url.1") {
       res[0] = data;
     }
     else if (data.url == "http://some.url.2") {
       res[1] = data;
     } 
}
// ajax(..)          Ajax   
ajax( "http://some.url.1", response ); 
ajax( "http://some.url.2", response );
どちらのAjax応答が先に返ってきても、私たちはdata.urlを確認することによって(もちろん、サーバーからいつか戻ってくると仮定する)。レスポンスデータをレスポンス配列のどの位置に置くべきかを判断します。res[0]は常に「http://some.url.1」の結果を含み、res[1]は常に「http://some.url.2という結果になりました。簡単な協調によって,競合条件による不確実性が回避された。
例2:

var a, b;
   function foo(x) {
     a = x * 2;
     baz(); 
   }
   function bar(y) {
     b = y * 2;
     baz(); 
   }
   function baz() {
     console.log(a + b);
   }
// ajax(..)        Ajax   
ajax( "http://some.url.1", foo ); 
ajax( "http://some.url.2", bar );
この例では、foo()とbar()のどちらが先にトリガされるかにかかわらず、常にbaz()を早期に実行(aまたはbはまだ未定義の状態)させる。しかし、baz()の2回目の呼び出しは大丈夫です。この時はaとbはもう使えます。
この問題を解決するには様々な方法があります。ここでは簡単な方法を示した。

var a, b;
function foo(x) {
     a = x * 2;
     if (a && b) {
       baz();
     } 
}
function bar(y) {
     b = y * 2;
     if (a && b) {
       baz();
     } 
}
function baz() {
     console.log( a + b );
}
// ajax(..)        Ajax   
ajax( "http://some.url.1", foo );
ajax( "http://some.url.2", bar );
baz()を包む条件判断if(a&b)は伝統的にドアと呼ばれていますが、aとbの到着順は確認できませんが、それらの両方が準備されてからドアを開けます。
以上が本文の全部です。皆さんの勉強に役に立つように、私たちを応援してください。