Javascript

[Javascript]자바스크립트의 작동원리 -Thread(스레드)

이지영 2022. 7. 19. 14:06

자바스크립트의 작동원리 with Thread(스레드)

프로세스와 스레드

프로세스는 운영체제로부터 자원을 할당받는 작업 단위입니다. 그리고 스레드는 프로세스 내에서 할당받은 자원을 이용하는 실행 단위입니다. 어플리케이션이 실행되면 하나의 프로세스가 할당되고, 프로세스 내에서 여러개의 스레드가 돌아가며 어플리케이션이 빠르게 돌아갈 수 있도록 도와줍니다.

싱글 스레드란?

싱글 스레드란, 하나의 프로세스에서 한가지 작업을 실행하기 위해 순차적으로 실행되는 하나의 흐름이다. 다시말해, 동시에 하나의 코드만 실행할 수 있다는 뜻이다.

멀티 스레드란?

하나의 응용프로그램을 여러 개의 스레드로 구성하고 각 스레드로 하여금 하나의 작업을 처리하도록 하는 것

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

자바 스크립트는 싱글 스레드로 하나의 힙 영역과 하나의 콜 스택을 가진다.

하나의 콜 스택을 가지기 때문에 한번에 하나의 일 밖에 하지 못하고, 앞에 일이 완료 될때까지 다음 할 일을 하지 못하고 기다려야 하는 동기적 처리를 한다.

하지만, 자바 스크립트가 싱글 스레드라는 말은 정확히 말하자면, 자바스크립트 엔진은 은 단일 호출 스택을 사용한다는 점에서 싱글스레드로 동작하고, 자바스크립트가 구동되는 환경인 런타임환경(브라우저/node)이 멀티스레드를 사용한다.
다시말해, 자바스크립트 자체는 싱글 스레드 이지만, 자바스크립트 런타임은 싱글 스레드가 아니다.

자바스크립트의 run-time

자바스크립트의 런타임은 자바스크립트 엔진, 웹api, 이벤트루프, 콜백 큐로 구성되어 있으며, 자바스크립트 엔진은 모리 힙과 콜 스택으로 구성되어 있다.

https://medium.com/@vdongbin/javascript-%EC%9E%91%EB%8F%99%EC%9B%90%EB%A6%AC-single-thread-event-loop-asynchronous-e47e07b24d1c

  • Call Stack: 자바스크립트에서 수행해야 할 함수들을 순차적으로 스택에 담아 처리
  • Web API: 웹 브라우저에서 제공하는 API로 AJAX나 Timeout등의 비동기 작업을 실행
  • Callback Queue: Callback Queue라고도 하며 Web API에서 넘겨받은 Callback함수를 저장
  • Event Loop: Call Stack이 비어있다면 Task Queue의 작업을 Call Stack으로 옮김

런타임 환경에서 비동기 코드가 실행되는 방법

  1. 비동기 작업 코드는 호출스택에 쌓인 후 실행될때 해당 작업을 Web API에 위임한다
  2. Web API는 해당 작업을 수행하고 콜백 함수를 이벤트 루프를 통해 콜벡 큐에 넘겨준다
  3. 이벤트 루프는 콜스택에 쌓여있는 함수가 없을경우 태스트 큐에서 대기중이던 콜백 함수를 콜스택으로 넘겨준다
  4. 콜스택에 쌓인 콜백 함수가 실행되고, 해당 작업은 콜스택에서 제거된다