비동기 통신

기본 개념

자바스크립트의 엔진은 단하나의 실행 컨택스트를 갖는다. 이는 함수를 실행할 수 있는 창구가 단 하나이며, 동시에 2개 이상의 함수를 실행할 수 없다는 것을 의미한다. 이처럼 자바스크립트의 엔진은 한번에 하나의 태스크만 실행할 수 있는 싱글 스레드(single thread)방식으로 동작한다.

비동기 통신이란?

현재 실행중인 태스크가 종료되지 않은 상태라 해도 다음 태스크를 곧바로 실행하므로 블로킹이 발생하지 않는다는 장점이 있지만, 태스크의 실행 순서가 보장되지 않는 단점이 있다.

타이머 함수인 setTimeout, setInterval, HTTP 요청, 이벤트 핸들러는 비동기 처리 방식으로 동작한다. 

예시로,

동기적인건 전부 다 불러오는 것. 비동기적인 건 내가 원하는 부품만 빼서 왔다 갔다 하는 것. 비동기 통신을 많이 사용했던 예는 Gmail. 상단과 메뉴바를 제외해 메일 부분만 동작시켜 페이지를 바꿀 수 있는것.(이걸 하면서 다른 작업도 실행할 수 있다는 점)

 

 

이벤트 루프와 태스크 큐

이벤트 루프(event loop)

이벤트 루프란 자바스크립트의 동시성을 지원하는 것으로 브라우저에 내장되어 있는 기능 중 하나이다.

 

 

자바스크립트의 엔진

콜 스택(call stack)

실행 컨택스트 스택이 바로 콜스택이다. 함수를 호출하면 함수 실행 컨택스트가 순차적으로 콜스택에 푸시되어 순차적으로 실행된다. 자바스크립트의 엔진은 단 하나의 콜스택을 사용하기 때문에 최상위 실행 컨택스트가 종료되어 콜스택에서 제거되기 전까지는 다른 어떤 태스크도 실행되지 않는다.

힙(heap)

힙은 객체가 저장되는 메모리 공간이다. 콜스택의 요소인 실행 컨택스트는 힙에 저장된 객체를 참조한다.