이벤트 루프

자바스크립트 엔진은 코드를 평가해 스코프를 기준으로 실행 컨텍스트를 생성한다.

실행 컨텍스트는 전역 실행 컨텍스트를 시작으로 호출한 순서대로 실행 컨텍스트 스택(콜 스택)에 쌓인다.

콜 스택에 쌓인 실행 컨텍스트 중 최상위 실행 컨텍스트부터 처리해 코드를 실행하는데,

이렇게 하나의 콜 스택에서 모든 작업을 처리하는 방식을 싱글스레드 방식이라고 한다.

자바스크립트엔진은 싱글스레드 방식으로 동작한다. 

 

작업(실행 컨텍스트)을 처리하는 방식은 동기 처리와 비동기 처리로 구분된다.

동기 처리 방식은 현재 실행 중인 작업을 모두 마치고 다음 작업을 실행한다.

코드가 의도한 순서대로 실행되지만, 실행중인 작업이 길어질 경우 다음 작업이 중단된다.

반면 비동기 처리 방식은 실행중인 작업이 종료되지 않은 경우에도 다음 작업을 실행한다.

이 경우 다음 작업이 중단되는 블로킹이 발생하지 않지만, 작업의 실행 순서가 보장되지 않는다.

 

자바스크립트에서 setTimeout과 같은 타이머 함수, HTTP요청, 이벤트 핸들러 등의 함수는 

이벤트 루프와 태스크 큐에 의해 비동기 처리 방식으로 작업이 이루어진다.  

이벤트 루프는 자바스크립트 엔진이 아닌 브라우저 환경의 내장 기능 중 하나이다.

위의 비동기 함수 또한 자바스크립트 엔진이 실행 컨텍스트를 생성해 콜 스택에 쌓는다.

다만 함수가 실행된 후 타이머 설정, 콜백 함수 관리 등의 부분은 이벤트 루프에서 담당한다.

태스크 큐는 콜백함수 등 비동기 함수의 처리 결과를 일시적으로 보관하는 영역으로 브라우저에서 제공한다.

태스크 큐에 임시 보관된 작업 내용은 콜 스택에 남은 실행 컨텍스트가 없을 때

선입선출의 방식으로 이벤트 루프에 의해 콜 스택으로 옮겨져 실행된다.

(실행컨텍스트가 없다는 말은 전역 실행 컨텍스트를 포함한다.)