자바스크립트를 실행하기 위해서는 자바스크립트 엔진이 필요하다.
엔진의 구성 요소 : Memory Heap과 Call Stack
Memory Heap(메모리 힙) : 메모리 할당이 발생하는 공간
Call Stack(호출 스택) : 코드 실행에 따라 스택이 하나씩 쌓이는 공간
1. 파싱(Parsing)
자바스크립트 코드가 실행되기 전에 먼저 파싱 단계를 거친다.
코드를 토큰(token)으로 분해하고 문법을 분석하여 실행 가능한 형태로 변환
2. 실행(Execution)
파싱이 완료되면 코드가 실행된다.
이 때 자바스크립트 엔진은 코드를 한 줄씩 순차적으로 실행하면서 결과를 생성한다.
3. 실행 컨텍스트(Execution Context)
실행 컨텍스트는 코드가 실행될 때 생성되며, 해당 코드의 환경과 스코프 정보를 담고 있다.
함수 호출이 발생하면 새로운 실행 컨텍스트가 생성되며, 실행이 완료되면 이전 실행 컨텍스트로 되돌아간다.
4. 이벤트 루프(Event Loop)
자바스크립트는 단일 스레드로 동작하면서
비동기적인 이벤트 처리를 가능하게 하는 이벤트 루프를 가지고 있다.
이벤트 루프는 비동기 작업을 처리하고, 이벤트 큐에서 이벤트를 꺼내와 처리한다.
자바스크립트의 실행은 기본적으로는 동기적으로 진행된다.
코드는 위에서부터 아래로 순차적으로 실행되며,
한 줄이 실행되고 나서야 다음 줄이 실행된다.
하지만 비동기적인 작업을 처리할 때는 콜백 함수나 Promise와 같은 메커니즘을 사용하여 비동기적으로 실행될 코드를 정의하고, 이벤트 루프를 통해 해당 작업이 완료될 때까지 기다리지 않고 다음 코드를 실행할 수 있다.
정리 다시 !!!
참고 자료
https://joshua1988.github.io/web-development/translation/javascript/how-js-works-inside-engine/
https://tristy.tistory.com/51