계속 헷갈리는 Javascript 개념 잡기

Javascript는 동기적이고, blocking 이며, single-thread 로 동작하는 언어이다.

Q1. sync vs async ?

Sync와 Async는 대상과 시간이 어떻게 다루어지는 지를 확인해야 한다.

개념 정리

1. Synchonous: 호출된 함수의 리턴하는 시간과 결과를 반환하는 시간이 일치하는 경우
2. Asynchonous: 호출된 함수의 리턴하는 시간과 결과를 반환하는 시간이 일치하지 않는 경우

Javascript

Javascript는 single-thread, 동기적 언어이다. 하지만 비동기 작업을 처리하기 위한 방법(web API)가 존재하는 것이다.

Javascript engine = Memory heap + call stack

• Memory heap 변수와 객체의 메모리 할당을 담당
• Call stack 호출된 함수가 쌓이는 곳. 함수의 실행 순서를 기억한다.

Javascript runtime environment = javascript engine + event loop + Web API + callback queue + render queue

• Node.js나 브라우저가 가지고 있다.
  - Node.js Chrome V8 자바스크립트 엔진으로 빌드된 런타임 환경. 브라우저 이외의 환경에서 자바스크립트를 동작시킬 수 있게 해준다.
• Callback queue 완료된 비동기 작업 또는 Web API의 결과물을 쌓아두는 곳
• Event loop 엔진의 stack과 런타임환경의 queue를 관찰하다가 stack이 비어 있을 때 queue의 첫 번째 요소를 stack에 넣어줌
• Render queue callback queue보다 우선순위가 높다.

Q2. blocking vs non-blocking ?

Blocking과 Non-Blocking은 직접 제어할 수 없는 대상을 처리하는 방법에 따라 나눈다.
직접 제어할 수 없는 대상은 대표적으로 IO, 멀티쓰레드 동기화가 있다.

개념 정리

1. Blocking: 직접 제어할 수 없는 대상의 작업이 끝날 때까지 제어권을 넘겨주지 않는 것이다.
2. Non-Blocking: 직접 제어할 수 없는 대상의 작업 처리 여부와 상관이 없다.

Javascript

Javascript는 기본적으로 blocking 이지만, 비동기 작업에 대해서는 Non-blocking로 동작하게 할 수 있다.

Node.js

blocking 메서드는 동기로 실행되고 non-blocking 메서드는 비동기로 실행된다. Node.js 표준 라이브러리의 모든 I/O 메서드는 논블로킹인 비동기 방식을 제공하고 콜백 함수는 받는다. 일부 메서드는 같은 작업을 하는 블로킹 메서드도 가지는데 이는 이름 마지막에 Sync가 붙는다.

Reference

• 자바스크립트 비동기 작업 동작
• 자바스크립트 런타임
• MDN 비동기 자바 스크립트
• sync/async와 blocking/non-blocking 개념 정리 1
• sync/async와 blocking/non-blocking 개념 정리 2
• await은 정말 Non-blocking일까?