프론트엔드 개발 · 중급
JavaScript의 이벤트 루프(Event Loop)와 비동기 처리 방식에 대해 설명해주세요.
힌트 · Call Stack, Task Queue, Microtask Queue의 관계를 설명해보세요.
콜 스택태스크 큐비동기 API이벤트 루프동시성
모범답안
JavaScript는 싱글 스레드 기반이지만, 이벤트 루프를 통해 비동기적인 작업을 효율적으로 처리합니다.
JavaScript 엔진은 콜 스택을 사용하여 동기적인 코드를 순차적으로 실행합니다. 비동기적인 작업(예: setTimeout, 네트워크 요청)은 브라우저나 Node.js 환경에 위임되고, 완료되면 태스크 큐(Task Queue)에 콜백 함수가 추가됩니다.
이벤트 루프는 콜 스택이 비어있는지 지속적으로 확인하고, 비어있다면 태스크 큐에서 콜백 함수를 꺼내 콜 스택에 넣어 실행합니다. Microtask Queue는 Promise나 MutationObserver와 관련된 콜백을 저장하며, 태스크 큐보다 우선순위가 높아 이벤트 루프가 다음 태스크를 처리하기 전에 먼저 실행됩니다.
이러한 방식으로 JavaScript는 싱글 스레드 환경에서도 blocking 없이 여러 작업을 동시에 처리하는 것처럼 보이게 합니다. 이것이 JavaScript의 동시성(concurrency) 모델의 핵심입니다.
읽었다면, 이제 직접 답해볼 차례예요
패스잇 앱에서 이 질문에 말로 답하면 AI가 꼬리질문까지 이어가며 1:1 코칭합니다.