1. 동기와 비동기

1. 동기

: 데이터의 요청과 결과가 한 자리에서 동시에 일어나는 것을 의미한다. 요청을 하면 시간이 얼마나 걸리던지 요청한 자리에서 결과가 주어져야 한다.

2. 비동기

: 동시에 일어나지 않는 것을 의미한다. 하나의 요청에 따른 응답을 즉시 처리하지 않아도, 그 대기 시간동안 또 다른 요청에 대해 처리 가능한 방식이다. JS는 동기 동작을 JS엔진의 콜 스택을 통해 지원하고, 비동기 동작을 브라우저의 Web APIs를 통해 지원한다.

2. JS언어의 비동기 동작

JS언어 자체가 비동기 동작을 지원하지 않는다. 비동기로 동작하는 핵심요소는 JS언어가 아니라 브라우저가 가지고 있다. (Nodejs에서는 libuv 라이브러리 등) 브라우저는 Web APIs, Event Table, Callback Queue, Event Loop 등으로 구성된다.

<aside> 💡 Libuv?

비동기 I/O를 위한 크로스 플랫폼 라이브러리

자세한 내용 : 1. Libuv 라이브러리

</aside>

Untitled

  1. Heap : 메모리 할당이 발생하는 곳
  2. Call Stack : 실행된 코드의 환경을 저장하는 자료구조. 함수 호출 시 Call Stack에 push됨
  3. Web APIS : DOM, AJAX, setTimeout 등 웹 브라우저가 제공하는 API
  4. Callback Queue : Web APIs에서 비동기로 실행된 콜백함수의 결과값을 쌓아두는 큐
  5. Event Loop : Call Stack이 비어있으면 Callback Queue에서 콜백함수를 Call Stack으로 이동시키는 역할

1. Web API란?

: AJAX 요청, setTimeout(), 이벤트 핸들러의 등록과 같이 웹 브라우저에서 제공하는 기능으로, V8 소스코드에는 존재하지 않는다.