Promises を使用して jQuery で 3 つの非同期呼び出しをチェーンし、ある呼び出しから次の呼び出しにデータを渡すにはどうすればよいでしょうか?

jQuery Promises を使用した 3 つの非同期呼び出しの連鎖

この質問では、1 つのメソッドで 3 つの非同期 HTTP リクエストを行うシナリオを検討します。

初期アプローチ:

質問で述べたように、次の呼び出しに遅延を使用しようとしました。最初の 2 つの関数。これは良いスタートではありましたが、2 つの関数の場合しかカバーしていませんでした。これを 3 つの関数に拡張するには、少し異なるアプローチが必要です。

JqXHR オブジェクトによるチェーン:

複数の非同期呼び出しをチェーンする鍵は、$ によって返される jqXHR オブジェクトを返すことです。各関数の .ajax() 。これらのオブジェクトは Promise と互換性があり、.then()/.done()/.fail()/.always().

更新コード:

function first() {
   return $.ajax(...);
}

function second(data, textStatus, jqXHR) {
   return $.ajax(...);
}

function third(data, textStatus, jqXHR) {
   return $.ajax(...);
}

function main() {
    first().then(second).then(third);
}

この更新されたコードでは、first() 関数は AJAX 呼び出しから jqXHR オブジェクトを返し、それが引数として Second() 関数に渡されます。次に、2 番目の() 関数はその jqXHR オブジェクトを返し、それが 3 番目の() 関数に渡されます。

関数間のデータの受け渡し:

引数のデータ、textStatus、および jqXHR は、前の関数の $.ajax() 呼び出しから発生します。これは、first() が Second() にフィードし、Second() が Third() にフィードすることを意味します。したがって、これらの引数を使用して、ある関数から次の関数にデータを渡すことができます。

デモ:

以下のコードは、jQuery Promise を使用した 3 つの非同期呼び出しのチェーンを示しています。 。 $.when('foo') を使用して、$.ajax(...) の代わりに実行された Promise を配信します。

以上がPromises を使用して jQuery で 3 つの非同期呼び出しをチェーンし、ある呼び出しから次の呼び出しにデータを渡すにはどうすればよいでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。