jQuery の Promise の使用方法についてどのくらい知っていますか?この記事では主に jQuery の Promise の正しい使い方を紹介し、皆さんのお役に立てれば幸いです。
以前 ES6 の Promise オブジェクトについて学習したので、jQuery の Deferred オブジェクトである jQuery の Promise を見てみましょう。
まずブラウザのコンソールを開きます。
動作結果:
は、ES6 の Promise オブジェクトに少し似ています。jQuery の Deferred オブジェクトには、done、fail、always... メソッドだけでなく、resolve、reject、then メソッドもあります。 jQuery は、この Deferred オブジェクトを使用して、非同期操作のコールバック関数を登録し、非同期操作のステータスを変更および転送します。
Deferred で遊ぶ:
実行後、Deferred オブジェクトの defer インスタンスはパラメータ「非同期リクエストが成功した後に返されるデータ」を then メソッドに返し、resolve メソッドを介して受信および出力します。
ES6 Promise に似ていますが、少し違いがあります。
次のことがわかりました。
1. Promise の作成時にパラメーターは渡されません。オブジェクト、パラメーターが渡されます (匿名関数が渡され、この関数には、resolve メソッド、reject
という 2 つのパラメーターもあります)。Promise オブジェクトは内部でsolveメソッドを呼び出します。説明: Deferred オブジェクト自体にはsolveメソッドがあり、コンストラクター内でresolveメソッドを実行することでPromiseオブジェクトに実行結果のステータスが代入されます。
これには欠点があります: Deferred オブジェクトには独自のsolveメソッドがあるため、Deferredオブジェクトを取得した後はいつでもresolveメソッドを呼び出すことができ、そのステータスを手動で介入できます
明らかに、これは良くありません。非同期リクエストを送信しましたが、データが受信される前に、誰かが外部でリクエストを終了しました。 。 。 。 。 。 。
もちろん、jQuery は間違いなくこの穴を埋めます。 Deferred オブジェクトには Promise メソッドがあります。これは制限された Deferred オブジェクトです
いわゆる制限された Deferred オブジェクトは、resolve メソッドと拒否メソッドのない Deferred オブジェクトです。このように、Deferred オブジェクトの状態を外部から変更することはできません。
Deferredオブジェクトとdoneとfailの糖衣構文のthenメソッド
ES6のPromise仕様では、thenメソッドは実行完了と実行失敗のコールバックである2つのパラメータを受け入れることがわかっており、jqueryが強化されていますでは、次のように、保留状態のコールバックである 3 番目のパラメーターを受け入れることもできます:
then メソッド:deferred.then( doneFilter [, failFilter ] [, progressFilter ] )
Deferred オブジェクトの then メソッドは、チェーン操作を実行することもできます。実行完了と実行失敗のコールバックをそれぞれ指定するために使用される
always の使用法
jquery には Deferred オブジェクトもあります実行が完了したか失敗したかに関係なく実行されます。これは、ajax での complete に似ています。
$.whenの使い方
jqueryにはPromiseを実装するための$.whenメソッドもありますが、これはES6のallメソッドと同じ機能を持っており、非同期操作を並行して実行し、結局コールバックを実行します。非同期操作が実行される関数です。ただし、$.when は $.Deferred では定義されていません。$.when という名前を見れば、これが別のメソッドであることがわかります。 ES6 の all パラメータとは少し異なります。次のように、配列ではなく複数の Deferred オブジェクトを受け入れます。最も速い方法に基づいた方法です。そうですね、jqueryには存在しません。
上記は、jquery の Deferred オブジェクトの一般的なメソッドです。 前回の記事と今回の記事では、データ処理に非同期リクエストの代わりにワンタイムタイマーを使用しました。なぜ ajax を使用しないのですか? それは問題があるからではありません。 ここで ajax と Deferred の関係について話したいと思います。
jquery の ajax は制限付きの Deferred オブジェクトを返します。 Deferred オブジェクトであるため、状態を外部から変更することはできません。そのため、上で説明したすべての機能は ajax でも利用できます。たとえば、連鎖呼び出し、複数のリクエストの連続送信:
success、error、complete
これら 3 つのメソッドは、一般的に使用される ajax 構文の糖衣です。概要:
$.Deferred は Promise 仕様を実装し、then、done、fail、always は Deferred オブジェクトのメソッドです。 $.when は複数の非同期タスクを並行して実行するために使用されるグローバル メソッドであり、ES6 のすべてと同じ機能です。 ajax は、制限付きの Deferred オブジェクトを返します。Success、error、および complete は、ajax によって提供される構文上の機能であり、Deferred オブジェクトの Done、Fail、および Always と一致します。
関連する推奨事項:
promsie.allとPromiseの逐次実行の詳細な説明
JSでPromiseを使用して信号機のサンプルコードを実装する(デモ)
以上がjQueryのPromiseの正しい使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。