프론트엔드/JavaScript

자바스크립트 이벤트 루프가 뭘까

카엔입니다 2023. 2. 16. 05:39

자바스크립트 이벤트 루프가 뭘까

이벤트 루프


자바스크립트는 이벤트 루프를 이용해 비동기 방식으로 동시성을 지원한다

마치 비동기처럼 보이는게 이것때문인데 그럼 이벤트루프란 뭘까

브라우저에서 지원하는 기능이며 콜스택과 콜백큐를 감시해 콜스택이 비면 콜백큐에서 콜백함수를 가져와 콜스택에 넣어 실행시키는 기능이다

추가적으로 태스크 큐와 마이크로태스트 큐가 존재한다

태스크 큐는 콜백큐와 동일한 말이다

그렇다면 마이크로태스트 큐는 뭘까?

기본적으로 이벤트 루프는 제일 오래된 태스크(콜백 함수)를 꺼낸다

결론적으로는 마이크로태스크 큐에 들어간 태스크를 먼저 처리하고 태스크 큐를 처리하는데

그렇다면 태스크 큐에 들어가는 함수와 마이크로태스크 큐에 들어가는 함수들을 구분지어보자

  • 태스크 큐
    • setTimeout
    • setInterval
    • request animation frame
    • ui 렌더링
  • 마이크로태스크 큐
    • Promise
    • Object.observe