Event Loop

single thread

スレッド(thread)とは、任意のプログラム、特にプロセス内で実行されるストリームの単位を指す.
JavaScriptの大きな特徴は「単一スレッド」に基づく言語です.
1つのスレッドは、同時に1つのタスクしか処理できないということです.しかし、実際にはJavaScriptを使用する環境を考慮すると、多くのタスクが同時に処理されていることがわかります.
例えば、Webブラウザは、マウス入力を受信して処理し、アニメーション効果を表示します.jsベースのWebサーバは、複数のHTTP要求を同時に処理することができる.

JS Engine

JavaScriptエンジンはMemory HeapとCall Stackで構成されています.(図左)
最も有名なのはグーグルのV 8エンジンです.
JavaScriptは単一スレッドプログラミング言語です.
これはCallStackが一体であることを意味します.

コールスタック

JavaScriptエンジンはMemory HeapとCall Stackで構成されています.
MemoryHeapはメモリ割り当てが発生する場所で、プログラミング時に宣言した変数、関数などが含まれています.
Call Stackはコード実行時にスタックされる場所で、Stackの形でスタックされます.
StackはLIFO先入後出,すなわち最後に入るのが先出の構造である.

	function test () {
    
    
    }

コールバック関数

別の関数パラメータに渡す関数
コールバック受信関数による特定の時点での実行
同期コールバックの場合は、すぐに呼び出します.
非同期コールバックの場合は、後で条件を満たすときに実行します.
イベントリスナー
タイマ/XMLHttpRequestリクエスト

Web API

Web APIはブラウザが提供するAPIであり、Call Stackで実行される非同期関数はWeb APIを呼び出す.
Web APIはコールバック関数をCallback Queueに入れます.
私たちがよく使うsettimeoutやAJAXなどの非同期呼び出しやイベントは、Web上で操作することができます.

Callback Queue / Task Queue

非同期コールバック関数を含む領域
Queue資料構造はFIFO構造を採用し、先に入ってから出る.

Event Loop

Event LoopはCall StackとCallback Queueの状態をチェックします.
Call Stackが空の場合、Calback Queueの最初のコールバックがCall Stackにプッシュされます.
このような繰り返しの行為を滴答と呼ぶ.
オペレーションプロセス
コードが

V 8エンジンで実行されると、コールスタックに蓄積されます.

Stackの先入後出規則に従って、最初に入った関数が最初に実行されます.
スタックに積み重ねられたすべての関数が実行されます.

非同期関数が実行されると、Web APIが呼び出される.

Web APIは、非同期関数のコールバック関数をCallback Queueにプッシュする.

イベントループは、呼スタックのアイドル時に

である.

Callback Queueの最初のコールバックをCall Stackに移動します.
△このような繰り返しの行為を滴答と呼ぶ.

整理する

JavaScriptは、単一スレッドベースの非同期動的言語です.
Memory Heap:メモリ割り当ての場所
Call Stack:実行コード環境のデータ構造を格納し、関数呼び出し時にCall Stackにプッシュされます.
Event Queue:Web APIにおける非同期コードのシーケンス格納構造
Web API:DOM、AJAX、settimeoutを含むブラウザが提供するAPI
Event Loop:Calback Event Queueから1つずつ取り出して動作させるLoopをEvent Loopと呼びます.