JSのイベントループ(イベントループ)

説明:

Javascriptが非ブロックシングルスレッドのスクリプト言語です。

ブラウザは、開いたリソース(CPU、メモリ)のその割当てを処理するためのマルチ処理システムであるChromeプライマリ・プロセスが存在することになる、各オープンAのTab独立したプロセスがあるページ。

タスクと非同期タスクへのJavaScriptの同期タスクは、すべてのタスクがメインの実行スタック(スタックの実行コンテキストスタック形式の実行)に同期され、待機中のタスクの結果は、メインの実行スタックまで、タスクキュー(タスクキュー)に入り、コールバック非同期タスクのタスクキューの前にフィニッシュまでタスクは、非同期タスクがメインの実行スタックに挿入されます、もう一度入力します次の非同期タスクは、実装プロセスを通じて、私たちはイベントサイクルと呼ばれる、サイクルを完了します。タスクキューは、最新の規格では、マクロタスク(マクロタスク)とマイクロタスク(マイクロタスク)に分割され、それらはタスクとジョブと呼ばれています。

マクロタスクは、おそらく次のとおりです。

  • スクリプト(全体的なコード)
  • setTimeout
  • setInterval
  • setImmediate
  • I / O
  • UIのレンダリング

マイクロタスクは、おそらく次のとおりです。

  • process.nextTick
  • 約束する
  • 非同期/待って(実際には約束)
  • MutationObserver(HTML5の新機能)

全体の実行フロー・チャート:

 

 

 

 

 

非同期/のawait実行順序注:

输出:スクリプト開始=> async2エンド=>の約束=>スクリプト終了=> promise1 => promise2 => async1終了=>のsetTimeout

 

このコードの分析:

 

  1. コード、出力を実行しますscript start
  2. 実行async1は()、出力、()async2を呼び出してasync2 end、この時点では、コンテキストasync1機能を保持し、その後、async1機能を飛び出すことになります。
  3. 遭遇のsetTimeoutは、マクロタスクを生成します
  4. 执行Promise,输出Promise。遇到then,产生第一个微任务
  5. 继续执行代码,输出script end
  6. 代码逻辑执行完毕(当前宏任务执行完毕),开始执行当前宏任务产生的微任务队列,输出promise1,该微任务遇到then,产生一个新的微任务
  7. 执行产生的微任务,输出promise2,当前微任务队列执行完毕。执行权回到async1
  8. 执行await,实际上会产生一个promise返回,即 let promise_ = newPromise((resolve,reject){ resolve(undefined)})
  9. 执行完成,执行await后面的语句,输出async1 end
  10. 最后,执行下一个宏任务,即执行setTimeout,输出setTimeout

 

 

新版的chrome浏览器中不是如上打印的,因为chrome优化了,await变得更快了,输出为:

 

而await后面跟的是一个异步函数的调用,比如上面的代码,将代码改成这样:

 

 输出:script start => async2 end => Promise => script end => async1 end => promise1 => promise2 => async1 end setTimeout

 

 未写完,后续待更新...

 

おすすめ

転載: www.cnblogs.com/babyfacer/p/12306026.html