jQueryを使用してJavaScriptの非同期値を取得するにはどうすればよいですか?

jQuery を使用した JavaScript での非同期値の取得

JavaScript では、特に戻り値を取得して割り当てようとする場合、非同期コードの管理が困難になることがあります。 。次の jQuery 関数について考えてみましょう。

<code class="javascript">function trackPage(){
    var elqTracker = new jQuery.elq(459);
    elqTracker.pageTrack({
        success: function() {
            elqTracker.getGUID(function(guid) {
                alert(guid);
                var returnValue = guid;
            });
        }
    });
    return returnValue;
}

var someGuid = trackPage();</code>

alert() 関数は GUID 値を正しく表示しますが、それを変数 someGuid に割り当てると、値が未定義になります。これは、jQuery の getGUID() メソッドの非同期の性質によるものです。

非同期呼び出しの性質

例のような非同期呼び出しは、独立して実行されます。プログラムの主な流れ。 getGUID() メソッドが呼び出されると、すぐに実行され、結果が得られる前に戻ります。その結果、returnValue 変数は未定義に割り当てられます。

代替解決策

この問題に対処するには、いくつかのアプローチを使用できます。

1.コールバック関数

コールバック関数は、dfsq によって提案されているように、非同期呼び出しの結果を受け取る関数を渡すためのメカニズムを提供します。ただし、複数のネストされたコールバック関数が必要な場合、このアプローチは複雑になる可能性があります。

2. jQuery $.Deferred

jQuery の $.Deferred オブジェクトを使用すると、カスタムの非同期ロジックが Promise を返すことができます。 Promise を使用すると、深いネストを必要とせずに、非同期呼び出しの結果にコールバックをアタッチできます。以下の更新されたコードは、このアプローチを示しています。

<code class="javascript">function trackPage(){
    var elqTracker = new jQuery.elq( 459 ),
        dfd = $.Deferred();

    elqTracker.pageTrack({
        success: function() {
            elqTracker.getGUID(function( guid ) {
                dfd.resolve( guid );
            });
        }
    });

    return dfd.promise();
}

// example use:
trackPage().done(function( guid ) {
    alert( "Got GUID:" + guid );
});</code>

コールバックを Promise にアタッチすると、柔軟性が向上し、より組織化されたコードが可能になります。 Promise を返すことにより、他のコードも非同期呼び出しの結果を消費して待つことができます。

以上がjQueryを使用してJavaScriptの非同期値を取得するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。