[JavaScript] 이벤트 루프란?

 

이벤트 루프는 자바스크립트의 비동기 실행 모델을 구현하는 핵심 메커니즘입니다. 

자바스크립트가 단일 스레드 언어임에도 불구하고 비동기적으로 작업을 처리할 수 있게 해주는 중요한 요소입니다.

 

1. 이벤트 루프의 주요 구성 요소

 

1. 콜 스택 (Call Stack):
   - 자바스크립트 코드가 실행되는 곳입니다.
   - 함수 호출 시 스택에 쌓이고, 실행 완료 시 스택에서 제거됩니다.

2. 힙 (Heap):
   - 객체가 할당되는 메모리 영역입니다.

   - 변수와 객체의 메모리 할당이 이루어지는 곳입니다.

3. 태스크 큐 (Task Queue) 혹은 콜백 큐:
   - 비동기 콜백 함수들이 대기하는 큐입니다.
   - setTimeout, setInterval, I/O 작업 등의 콜백이 여기에 추가됩니다.

4. 마이크로태스크 큐 (Microtask Queue):
   - Promise의 then/catch/finally 핸들러, queueMicrotask()로 등록된 콜백 등이 대기하는 큐입니다.
   - 태스크 큐보다 우선순위가 높습니다.

5. Web APIs  (브라우저 환경의 경우 ):
   - 브라우저에서 제공하는 API들(DOM, AJAX, setTimeout 등)입니다.
   - 비동기 작업을 처리하고 완료 시 콜백을 태스크 큐에 추가합니다.

 

2. 이벤트 루프의 작동 과정

 

1. 콜 스택의 모든 작업이 완료될 때까지 실행합니다.
2. 콜 스택이 비면, 마이크로태스크 큐의 모든 작업을 실행합니다.
3. 마이크로태스크 큐가 비면, 태스크 큐에서 하나의 작업을 가져와 실행합니다.
4. 1-3 과정을 계속 반복합니다.

이 과정을 통해 자바스크립트는 다음과 같은 특성을 가집니다:

- 논블로킹: 오래 걸리는 작업을 기다리지 않고 다른 작업을 수행할 수 있습니다.
- 동시성: 여러 작업을 동시에 처리하는 것처럼 보이게 합니다.
- 비동기 처리: 콜백, Promise, async/await 등을 통해 비동기 코드를 효율적으로 관리할 수 있습니다.

 

예상 답변

 

이벤트 루프는 자바스크립트의 비동기 실행 모델을 구현하는 핵심 메커니즘입니다. 

1. 단일 스레드로 동작하는 자바스크립트 엔진이 비동기 작업을 처리할 수 있게 해줍니다.

2. 콜 스택, 태스크 큐(콜백 큐), 마이크로태스크 큐 등의 구성요소로 이루어져 있습니다.

3. 콜 스택이 비어있을 때 태스크  큐 (콜백 큐)  에서 작업을 가져와 실행합니다.

4. 비동기 작업(타이머, I/O 등)의 콜백을 적절한 시점에 실행할 수 있게 관리합니다.

5. 이를 통해 블로킹 없이 비동기 작업을 효율적으로 처리할 수 있습니다.

6. Promise나 async/await 같은 비동기 패턴의 기반이 됩니다