[JS] 이벤트 루프

---

알고있으면 좋은 Javascript Tip✨

---

이벤트 루프란 무엇인가?

• 보통 자바 스크립트는 단일 스레드 기반의 언어로 한 번에 하나의 작업만을 처리할 수 있다.
• 하지만 이벤트 루프를 이용해 비동기 방식으로 동시성을 지원한다.
• 여러 이벤트가 동시에 발생되었을 때 어떤 순서로 콜백 함수를 호출할지 판단하고 이벤트가 종료될 때까지 이벤트 처리를 위한 작업을 반복한다.

 

(1) 이벤트 루프 진행 과정

• Web API : 브라우저에서 제공하는 API로 DOM, Ajax, TimeOut 등이 있다.CallStack에서 실행된 비동기 함수는 Web API를 호출하고, Web API는 콜백 함수를 Task Queue에 넣는다.
• 콜스택 : 실행된 코드의 환경을 저장하는 자료구조로, 함수 호출 시 이곳에 저장됩니다. 어떤 함수를 저장하면 스택에 쌓고 또 다른 함수를 호출하면 그 다음 스택에 쌓이면서 가장 위에 쌓인 함수를 가장 먼저 처리한다.
• 콜백큐 : 함수를 저장하는 자료구조로, Call Stack과 다르게 가장 먼저 들어온 함수를 가장 먼저 처리한다.
• Event Loop : call stack이 다 비워지면 callback queue에 존재하는 함수를 하나씩 call stack으로 옮기는 역할을 한다.