Event Loop

wony·2022년 4월 25일

Event Loop?

Callback Event Queue에서 하나씩 꺼내서 동작시키는 Loop를 말한다.

이게 무슨말이죠...?
자바스크립트는 싱글스레드 기반의 언어이기 때문에 한번에 하나씩 작업을 진행하고
이벤트 루프를 이용해서 비동기 방식으로 동시성을 지원합니다

(자바스크립트 엔진에서 제공되는 것은 아니고, 브라우저나 node.js에서 지원된다.
nodejs는 libuv 라이브러리를 사용하여, 이벤트 루프를 제공한다.)

이벤트 루프에서는 이벤트 발생 시 호출되는 콜백 함수들을 태스크 큐에 전달한다
태스트 큐에 담겨있는 콜백 함수들을 콜스택에 넘겨준다.
(이벤트 루프가 태스트 큐에서 콜스택으로 콜백 함수를 넘겨주는 작업은 콜스택에 쌓여있는 함수가 없을 때만 수행된다.

이것을 이해하려면 callStack 과 TaskQueue를 알아야한다

한번 setTimeout을 가지고 설명해보자!

모든 web api는 작동이 완료되면 콜백을 테스크 큐에 밀어넣습니다
이벤트 루프의 역할은 콜백큐와 태스크큐를 감시하는 역할 입니다

콜스택에 담기는것 중에 web API는 따로 빠져서 백그라운드에 저장이 되고 나중에 들어간것이 먼저 테스크큐에 들어가고 콜스택이 다 비워지면 실행이 됩니다
이벤트 루프를 도와주는 일꾼을 쓰레드라고 부르며 다른 말로 이벤트루프쓰레드, 싱글이벤트루프쓰레드,싱글쓰레드 라고도 부른다

여기서 api는 웹브라우저 를 말하며 다른곳에서는 다른 의미로 쓰이며 여러 의미가 있습니다

쓰레드에 대해 알아보자

프로세스와 쓰레드 하나의 프로그램과 일꾼이라고 생각하면 될것같다!
자바스크립트는 함수를 실행시켜주는 일꾼을 싱글쓰레드라고 하고
다른 언어에서는 여러 일꾼이 있는데 이것을 멀티쓰레드라고 부른다

싱글쓰레드는?

일꾼이 일하는 동안 아무일도 할 수 없음

멀티쓰레드란?

일꾼이 여러개인것이다!
각자 함수를 하나씩 실행한다면 여러가지 일을 동시에 실행이 가능하다
엄밀히 말하자면 동시실행은 아니다...!(그렇게 보이는것뿐)
일은 CPU가 하기 때문에 동시에 처리 하기 보단 그렇게 보일뿐인 것이다
중간쯤 하다가 다른일꾼으로 넘어가기 때문에 사실은 조금은 느리다
다른 일꾼으로 넘어가는 것을 context-switching이라고 부른다