JS - 자바스크립트 싱글 스레드

자바스크립트는 싱글 스레드?

• 자바스크립트의 메인 스레드인 이벤트 루프가 싱글 스레드이기 때문에 자바스크립트를 싱글 스레드 언어라고 부른다

• 하지만 이벤트 루프만 독립적으로 실행되지 않고, 웹 브라우저/NodeJS와 같은 멀티 스레드 환경에서 실행되기 때문에, 자바스크립트 자체는 싱글 스레드지만 자바스크립트 런타임은 싱글 스레드가 아니다.

싱글 스레드로 여러 요청을 처리하는 방법

자바스크립트의 런타임 환경

• Call stack
• 자바스크립트에서 수행해야 할 함수들을 순차적으로 스택에 담아 처리

• Web API
• 웹브라우저에서 제공하는 API로 AJAX, Timeout등의 비동기 작업 실행

• Callback Queue(Task Queue)
• Web API에서 넘겨받은 Callback(비동기) 함수를 저장

• Event Loop
• Call stack이 비어있으면 Callback Queue의 작업을 Call stack으로 넘김
⇒ Call stack이 비었을 때마다 Callback Queue에서 대기중인 함수를 Call stack으로 불러와 실행시킨다.

비동기 동작 예시

• 다음과 같은 코드들을 수행한다고 해보자

setTimeout(() => console.log('async chanyeong'));
console.log('hello chanyeong');

// hello chanyeong
// async chanyeong

 

1. setTimeout() 호출, call Stack에 추가

1. console.log('hello chanyeong')로 로그가 출력된다.

1. Call Stack이 비워진 걸 확인 후, Event Loop는 Task Queue에 있던 callback 함수를 Call Stack으로 옮겨 작업을 수행한다. 콘솔에 hello async chanyeong이 출력된다.

싱글 스레드인 이유

• 만약 자바스크립트가 멀티스레드로 실행되는 언어였다면, 웹페이지에서 발생하는 동시성 문제에 대해 해결해야 하기 때문에 더 많은 신경을 쓰게 된다.

• 하지만 단일 스레드 언어이기 때문에 복잡한 시나리오를 신경 쓸 필요가 없으며 비동기 처리를 통해 쉽게 여러 요청을 처리할 수 있다.