EventLoop

Javascript 엔진에서의 작업 실행처리

JS 내부 동작 과정

---

1. MemoryHeap

일반적으로 우리가 선언하는 변수들이 저장되는 곳 (메모리 할당)

2. Heap

object 들이 담기는 구조화 되지 않은 메모리 영역

3. CallStack

last in first out 원칙 function 들을 call 해서 stack 처럼 쌓아두고(저장) 하나씩 (싱글스레드) 실행하는 곳

4. Callback queue

first in first out 원칙 다른 fuction 에게 인자로 전달된 function 들이 queue 처럼 쌓여있는 곳

5. Event Loop

콜스택과 콜백큐를 항상 주시하고 콜스택이 비어지면 콜백큐의 콜백함수를 콜스택으로 보내준다

6. Web APIs

비동기처리를 담당하는 API (DOM, Ajax, Timeout 등)

JS 내부 작업 처리 순서

---

1. CallStack 이 비어 있을때 까지 CallStack 의 작업을 먼저 처리한다.
2. 비동기처리 작업이 CallStack에 들어올 경우, Web APIs 등을 이용해 작업을 위임하고 해당 작업 스택은 Out 시킨 후 다음 작업을 처리한다. (이 때, 위임한 작업이 완료될 때까지 기다리지 않는다)
3. Web APIs 에서는 넘겨받은 작업(함수)를 처리하고, Callback queue 에 인자로 갖고 있던 콜백함수를 넘겨준다.
4. EventLoop는 CallStack이 비워지면 Callback queue 에 들어와 있던 함수를 CallStack으로 넘긴다.