🤔왜 비동기 처리모델이 필요한가?
자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖는다. 이는 함수를 실행할 수 있는 창구가 단 하이며, 2개 이상의 함수를 동시에 실행할 수 없다는 것을 의미한다.
이처럼 자바스크립트 엔진은 한 번에 하나의 태스크만 실행할 수 있는 싱글스레드 방식으로 동작한다.
순차적으로 한 번에 하나의 작업만 수행하기 때문에 처리에 시간이 걸리는 태스크를 실행하는 경우 블로킹이 발생한다.
동기 처리 방식은 블로킹에 의해 모든 로직을 순차적으로 실행하는데 시간적인 한계가 존재한다.
언제 끝날지 모를 무거운 작업을 마냥 다른 코드를 실행 안 하고 기다릴 수는 없다.
🤔동기 처리 모델과 비동기 처리 모델 각각의 장단점은 무엇인가요?
동기 처리 방식은 현재 실행 중인 태스크가 종료될 때까지 다음에 실행될 태스크가 대기하는 방식이다.
태스크를 순서대로 하나씩 처리하므로 실행 순서가 보장된다는 장점이 있지만, 앞선 태스크가 종료될 때까지 이후 태스크들이 블로킹되는 단점이 있다.
반대로 비동기 처리 방식은 현재 실행중인 태스크가 종료되지 않은 상태라 해도 다음 태스크를 곧바로 실행하는 방식을 말한다.
현재 실행중인 태스크가 종료되지 않은 상태라 해도 다음 태스크를 곧바로 실행하므로 블로킹이 발생하지 않는다는 장점이 있지만, 태스크의 실행 순서가 보장되지 않는 단점이 있다.
🤔비동기 처리가 가능한 이유?
싱글 스레드로 동작하는 것은 브라우저가 아니라 브라우저에 내장된 자바스크립트 엔진이며, 브라우저는 멀티 스레드로 동작한다.
자바스크립트 엔진은 하나의 코드 조각을 하나씩 실행하는 일을 하고, 비동기적으로 이벤트를 처리하거나 서버와 통신을 하는 작업은 사실상 브라우저의 Web API에서 모두 처리된다.
🤔비동기 처리 모델의 동작 과정에 대해 설명하시오.
비동기 처리 코드는 Web API 공간으로 보내져 이벤트가 발생할 때까지 대기하다가 이벤트가 발생하면 이벤트 태스크 큐로 이동한다.
이벤트 루프가 콜 스택에 현재 실행중인 실행 컨텍스트가 있는지 확인하고, 콜 스택이 비면 태스크 큐에 대기중인 함수를 순차적으로(FIFO) 콜 스택으로 이동시켜 비동기 함수를 실행한다.
🤔이벤트 루프가 무엇인가요?
브라우저에 내장되어 자바스크립트의 동시성을 지원하는 역할을 한다.
이름 그대로 loop, 반복적으로 콜 스택과 태스크 큐를 감시하다가 콜 스택이 비면 태스크 큐에 존재하는 함수를 콜 스택으로 옮긴다.
🤔태스크 큐가 무엇인가요?
비동기 함수의 콜백 함수나 이벤트 핸들러가 실행되기 앞서 일시적으로 보관되는 영역이다.
태스크 큐는 microtask queue와 task queue 두 가지가 있다.
- microtask queue
task queue의 작업보다 우선적으로 콜 스택에 올라간다.
프로미스의 핸들러가 microtask에 해당한다. - task queue
microtask queue에 작업이 없으면 task queue의 작업들이 콜 스택에 올라간다.
🤔비동기 처리 방식으로 동작하는 예를 들어보시오.
타이머 함수인 setTimeout과 setInterval, HTTP 요청, addEventListener 등이 비동기 처리 방식으로 동작한다.
브라우저 또는 Node.js가 호출 스케줄링을 위한 타이머 설정, 타이머 만료 후 콜백 함수 등록을 담당한다.
