2017-01-21 16 views
0

イベントリスナーに基づいたローダーがあります。これはpouchdbを介して行われます。JavaScriptで非同期イベント間で状態を維持する

ドキュメントがクライアントに受信されるたびに、リスナーが起動します。そのドキュメントがローダに関連しているかどうかを確認し、別の非同期コールバックがUIグローバル変数の割合を更新した後で確認します。

は今問題が

  • 応答がサーバから受信され、リスナーがイベントキューに追加され

    1. 別の応答がサーバから受信されると、リスナーがイベントキューに追加され
    2. のEventListener方法は
    3. イベントリスナーメソッドは、呼び出している
    4. doAsyncCallbackithVerificationがイベントキューに追加された最初のイベント待ち行列要素のために呼び出されますedは2番目のイベントキューの要素に対して
    5. doAsyncCallbackithVerificationはdoAsyncCallbackithVerificationメソッドが呼び出されたイベントキュー
    6. に追加され、割合は85
    7. doAsyncCallbackithVerificationメソッドが呼び出されるまで更新され、割合は再び85に
    8. に更新されます

    (メソッド呼び出しの回数が2であり、2 * 5以降)


    我々は割合が90であることを期待します

    これを処理する通常の標準は何ですか、私が上に書いたことは、はるかに複雑なケースに基づくjavascript擬似コードだったことに留意してください。また、RxJを使用しているため、これらのシナリオを軽減するために使用することもできます。

  • +0

    あなたが何をしたいのかはわかりません。 2番目のコールバックでパーセンテージが別の番号に変更されるべきですか? – AmericanUmlaut

    +0

    はい、それは期待された出力になるでしょう、私はまた、擬似コードをわずかに状態値を渡すために編集しました。所与の期待される出力は90となる。 – MilindaD

    答えて

    0

    あなただけの擬似コードをprovdidedので、正確な答えを出すのは難しいですが、これは私がRxJSでそれを行うだろうかについてです:

    const listenToDb = Observable.fromCallback(db.listenForTheEvents); // in RxJS5 it's 'bindCallback' 
    const asyncCbWithVerif = Observable.fromCallback(db.doAsyncCallbackWithVerification); // in RxJS5 it's 'bindCallback' 
    
    const fetchPercentage$ = listenToDb() 
        .filter(event => isLoaderRelated(event))  // don't propagate any unrelated events 
        .switchMap(event => asyncCbWithVerif(event)) // if some new event arrives, the switchMap will automatically cancel the last call of 'asyncCbWithVerif' 
        .do(newPercentage => console.log(newPercentage)); 
    
    fetchPercentage$.subscribe(); // or however you wish to activate the stream, maybe publish & share, maybe replay, ect... 
    
    0

    私は単純にイベントハンドラに割合を渡します完了した合計に加算します。あなたの質問に一致する擬似コード:

    var percentage = 80; 
    function eventListener() { 
        if(loaderRelated){ 
        doAsyncCallbackithVerification(percentage, function(percentageCompleted){ 
         percentage += percentageCompleted; 
        }); 
        } 
    } 
    
    db.listenForTheEvents(eventListener); 
    
    関連する問題