ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript における Promise ハンドラーの実行順序は何ですか?

JavaScript における Promise ハンドラーの実行順序は何ですか?

Susan Sarandon
Susan Sarandonオリジナル
2024-10-24 17:42:02724ブラウズ

What is the Execution Order of Promise Handlers in JavaScript?

Promise の実行順序を理解する

JavaScript では、Promise を使用して非同期操作を処理します。 Promise ハンドラーの実行順序は、特に Promise がネストされている場合に混乱する可能性があります。

コードの行ごとの分析

提供されたコード行を分析してみましょう実行順序を理解するために行ごとに説明します:

1. Promise.resolve('A')
  .then(function(a){console.log(2, a); return 'B';})
  .then(function(a){
    Promise.resolve('C')
      .then(function(a){console.log(7, a);})
      .then(function(a){console.log(8, a);});
    console.log(3, a);
    return 'B';})
  .then(function(a){
    Promise.resolve('D')
      .then(function(a){console.log(9, a);})
      .then(function(a){console.log(10, a);});
    console.log(4, a);})
  .then(function(a){
    console.log(5, a);});
  • 行 1: すぐに 'A' に解決される Promise を作成し、それに .then() ハンドラーをアタッチします。
  • 行 2: Promise が「A」で解決され、「B」を返すと、コンソールは「2」を記録します。
  • 行 5: もう 1 つ.then() ハンドラーが 1 行目で作成された Promise に追加されます。
  • 行 6 ~ 8: 'C' に解決される新しい Promise を作成し、2 つの .then() ハンドラーをアタッチします。そのコンソールはそれぞれ「7」と「8」をログに記録します。
  • 行 10: コンソールは「3」をログに記録し、「B」を返します。
  • 行 12- 14: 別の .then() ハンドラーが 5 行目で作成された Promise に追加されます。
  • 15 ~ 17 行目: 'D' に解決されて添付される新しい Promise を作成します。それぞれ '9' と '10' をコンソールに記録する 2 つの .then() ハンドラー。
  • 行 19: コンソール ログ '4'。
  • 行 22 -24: 別の .then() ハンドラーが 12 行目で作成された Promise に追加されます。
  • 行 27: Promise が解決されると、コンソールは「5」を記録します。

実行順序

  1. 行 1: Promise は解決され、コンソールのログは「2 A」
  2. 10 行目: コンソール ログ "3 B"
  3. 19 行目: コンソール ログ "4 B"
  4. 27 行目: コンソール ログ"5 未定義"
  5. 行 7: コンソール ログ "7 C"
  6. 行 8: コンソール ログ "8 未定義"
  7. 15 行目: コンソール ログ「9 D」
  8. 17 行目: コンソール ログ「10 未定義」
  9. 30 行目: コンソール ログ "1"
  10. 行 33: コンソール ログ "6"

ディスカッション

  • Promise ハンドラーは非同期でスケジュールされるため、現在の実行スレッドが完了した後に実行されます。
  • ネストされた Promise は、事前に決定された実行順序を持たない独立した Promise チェーンを作成します。
  • 次の順序Promise の実行は、Promise エンジンの実装に依存します。この場合、使用されるエンジンは、マクロタスク (setTimeout()) の前にマイクロタスク (Promise ハンドラー) をスケジュールします。
  • ネストされた Promise の特定の実行順序に依存することはお勧めできません。代わりに、チェーンは実行順序を制御することを明示的に約束します。

以上がJavaScript における Promise ハンドラーの実行順序は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。