JSイベントサイクル機構(event loop)

2061 ワード

はじめに
JavaScriptを学んだことがあると信じていますが、それは単一スレッドの言語であり、これはJSがマルチスレッドプログラミングができないことを意味しています.しかし、JSの中にはどこにでもあります.初期に多くの人が非同期をマルチスレッドのようなプログラミングモードに理解していますが、実は彼らの中には大きな違いがあります.非同期を完全に理解するには、JSの運行コアであるイベントサイクルを理解する必要があります.
二JSエンジンの二つの特徴:シングルスレッドとブロックではない.
単スレッド
JSエンジンは単一スレッドのイベントサイクルの概念に基づいて構築された.同じ時刻に1つのコードブロックだけが実行されます.これとは反対にJAVAとC++のような言語で、複数の異なるコードブロックが同時に実行されます.スレッドベースのソフトウェアでは、複数のコードブロックが同時にアクセスして状態を変えると、プログラムは維持しにくく、エラーがないように保証します.
渋滞ではない
ブロックでないと、コードが非同期のタスク(すぐに結果を返すことができず、I/Oイベントなどの一定の時間がかかるタスク)を行う必要がある場合、メインラインはこのタスクを保留して、非同期のタスクが結果を返すときに、一定の規則に従って対応するコールバックを実行します.非ブロッキングはイベントサイクル機構によって実現される.JSは通常渋滞していません.いくつかの特殊な状況を除いて、JSはコードの実行を停止します.
  • alert、confirm、prompt(Operaを除く)
  • 「ページ上のプログラムが忙しい」システムダイアログが表示されます.
    三イベントキュー
    まず、簡単なコードを見てみましょう.
    console.log("script start"); 
    
    setTimeout(function () {
        console.log("setTimeout");
    }, 1000);
    
    console.log("script end");
    
    まずプログラム出力「script start」と「script end」は、約1 s後に「set Timeout」と出力されているのが見えます.このプログラムの「スクリプトend」は1 s後の出力を待つのではなく、すぐに出力します.これはsetTimeoutが非同期の関数であるためである.つまり、遅延関数を設定すると、現在のスクリプトはブロックされません.ブラウザのイベントテーブルに記録されるだけで、プログラムは下に進みます.遅延時間が終了すると、イベントテーブルはコールバック関数をイベントキューに追加し、イベントキューはタスクを取得した後、タスクを実行スタックに押し込み、スタック実行タスクを実行して、「set Timeout」を出力します.
    イベントキューは実行待ちのタスクが格納されているキューです.その中のタスクは時間順に厳格に実行され、先頭に並べられたタスクは率先して実行されます.最後のタスクは最後に実行されます.イベントキューは、各タスクのみ実行し、そのタスクの実行が完了したら、次のタスクを実行します.実行スタックは、関数コールスタックのような実行容器であり、実行スタックが空の場合、JSエンジンはイベントキューをチェックし、空でない場合は、イベントキューは、最初のタスクを実行スタックに押し込んで実行する.
    四事件循環メカニズム
    JSは単一スレッドのため、同期実行タスクはブラウザのブロッキングを引き起こすので、JSを一つ又一つのタスクに分けて、連続的なループでイベントキューのタスクを実行します.これは私達がある任務を始める時に他の事をすることができて、この任務の執行が終わることを待つ必要がありません.したがって、イベントサイクルの運行メカニズムは、大きく分けて以下のステップに分けられます.
    1.イベントキューが空かどうかを確認し、空の場合は引き続きチェックします.空でない場合は、2を実行します.2.イベントキューのヘッダを取り出し、実行スタックに押し込む.3.任務を実行する4.実行スタックを確認し、実行スタックが空であれば、第1ステップにジャンプする.空でなければ、検査を続けます.
    五まとめ
    イベントのサイクルについては、以下の点を覚えておく必要があります.
    (1)イベントキューは時間順に厳格に実行スタックに押し込んで実行します.(2)スタックが空の場合、ブラウザは常にイベントキューをチェックし、空でない場合は最初のタスクを取り出します.(3)各タスクが終わったら、ブラウザはページをレンダリングします.