Promise は非同期プログラミングのソリューションです。非同期操作のメッセージを取得できるオブジェクトです。非同期プログラミングの難しさを大幅に改善し、コールバック地獄を回避します。コールバック関数やイベントなどの従来のソリューションよりも合理的で強力です。 構文的には、Promise は非同期操作からメッセージを受信できるオブジェクトです。さまざまな非同期操作を同じ方法で処理できるように、統一されたAPIを提供します。 1. Promise インスタンスには 3 つの状態があります。 (1)保留中 (2)解決 (3)拒否 2. Promiseインスタンスには2つのプロセスがある (1)保留中>完了:解決済み (2)保留中>拒否:拒否 注意: ステータスが「購入と販売」から「その他のステータス」に変更されると、ステータスを変更することはできません。 Promise の基本的な使用法:1. Promiseオブジェクトを作成するPromise オブジェクトは非同期操作を表し、保留中 (進行中)、実行済み (成功)、拒否済み (失敗) の 3 つの状態があります。 Promise コンストラクターは、関数をパラメーターとして受け入れます。その 2 つのパラメーターは、resolve と reject です。 2. プロミス方式Promise には 5 つの一般的なメソッドがあります。 (1)それから() then メソッドは、2 つのコールバック関数をパラメータとして受け取ることができます。最初のコールバック関数は、Promise オブジェクトの状態が resolved に変わったときに呼び出され、2 番目のコールバック関数は、Promise オブジェクトの状態が declined に変わったときに呼び出されます。 2 番目のパラメータは省略できます。 promise = new Promise((resolve,reject)=>{ とする ajax('first').success(function(res){ 解決する(res); }) }) promise.then(res=>{ 新しい Promise を返します ((resovle,reject)=>{ ajax('second').success(function(res){ 解決する }) }) }).then(res=>{ 新しい Promise を返します ((resovle,reject)=>{ ajax('second').success(function(res){ 解決する }) }) }).then(res=>{ }) (2) キャッチ() このメソッドは then メソッドの 2 番目のパラメータと同等であり、拒否コールバック関数を指します。 もうひとつの機能としては、resolve コールバック関数の実行時にエラーが発生して例外がスローされた場合、実行は停止せず catch メソッドに入ります。 p.then((データ) => { console.log('解決されました',データ); },(エラー) => { console.log('拒否されました',err); } ); p.then((データ) => { console.log('解決されました',データ); }).catch((エラー) => { console.log('拒否されました',err); }); (3) すべて() all メソッドはタスクを完了して実行できます。このメソッドは配列を受け取り、配列内の各項目は Promise オブジェクトです。配列内のすべての Promise 状態が解決済みに達すると、拒否される状態がある場合、すべてのメソッドの状態が解決済みになります。すると、すべてのメソッドのステータスが拒否されます。 ジャバスクリプト promise1 = new Promise((resolve,reject)=>{ とする タイムアウトを設定します(()=>{ 解決する(1); },2000) }); promise2 = new Promise((resolve,reject)=>{ とする タイムアウトを設定します(()=>{ 解決する(2); },1000) }); promise3 = new Promise((resolve,reject)=>{ とする タイムアウトを設定します(()=>{ 解決する(3); },3000) }); Promise.all([promise1,promise2,promise3]).then(res=>{ コンソールログ(res); //結果は[1,2,3]です }) (4) 受信() 受信メソッドは all と同じで、受信したパラメータは Promise の配列ですが、all とは異なり、最初のイベントが実行されると、promise オブジェクトの値が直接返されます。 rece の実際の機能: 何かをしたいが、長い間諦めてしまったときに、この方法を使って解決することができます。 Promise.race([promise1, timeOutPromise(5000)]).then(res=>{}) (5) 最後に() finally メソッドは、Promise オブジェクトの最終状態に関係なく実行される操作を指定するために使用されます。 (このメソッドはES2018標準で導入されています) 約束 .then(結果 => {···}) .catch(エラー => {···}) .finally(() => {···}); finally メソッドのコールバック関数はパラメーターを受け入れないため、以前の Promise ステータスが満たされたか拒否されたかを知る方法はありません。 約束 .finally(() => { // ステートメント }); // プロミスと同等 。それから( 結果 => { // ステートメントは結果を返します。 }, エラー => { //ステートメントはエラーをスローします。 } ); 上記のコードでは、finally メソッドが記述されていない場合は、成功と失敗の両方に対して同じステートメントを 1 回記述する必要があります。 finallyメソッドでは、一度だけ書くだけでよい。 要約するこの記事はこれで終わりです。皆さんのお役に立てれば幸いです。また、123WORDPRESS.COM のその他のコンテンツにも注目していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: CSS の両端揃えを実現する div+css レイアウトの 4 つの方法の概要
>>: ウェブページ作成時のHTMLタグの使用に注意してください
Array の filter、find、some、reduce メソッドの違いを区別し、使用シナリオ...
目次父から息子へ: 1. 親コンポーネントのサブコンポーネントタグに、サブコンポーネントに渡されるデ...
1. LinuxのMySQLで中国語の文字化けが発生する。以下の操作を実行する。 vi /etc/m...
Nginx 仮想ドメイン名設定を使用すると、ドメイン名を購入せずに特定のドメイン名を介してローカル ...
1. CSSを通す必要がある背景CSS におけるメディアクエリの用途は、デバイスサイズの判別、マウス...
目次render.js 部分create-context.js 部分差分部分Reactのソースコード...
1. なぜこの記事を書くのですか?重複リクエストの処理に関する記事をたくさん読んだことがあるでしょう...
目次1. まずRefとは何かを説明しましょう2. フックでのrefの使用1. HTMLDomフックで...
MySQLデータベースをダウンロードするには、https://dev.mysql.com/down...
問題の説明プロジェクトのログインページでは、7日間パスワードを記憶する必要がある機能があります。この...
例示するDML(データ操作言語)とは、データベースの追加、削除、変更を行うための操作命令のことです。...
一般的に、<td> 要素の colspan 属性はセルの列間操作を実装するために使用され...
目次序文1. 親コンポーネントが子コンポーネントに値を渡す2. サブコンポーネントのprops型制約...
MySQL マルチテーブルクエリワークシートを追加する -- ユーザーテーブル (ユーザー) テーブ...
目次1. 直接譲渡2. 浅いコピー3. ディープコピー1. JSONオブジェクトメソッド2. 再帰コ...