A:

[TL;DR] JS 엔진이 코드를 실행할 때 어디서 부터 어떻게 실행할 지 정리해 놓은 공간

• 실행 컨텍스트 = 코드 실행을 위한 “상자”

• 자바스크립트는 실행 중인 정보를 여기에 저장해두고 관리함

• 함수가 실행될 때마다 새로운 컨텍스트가 생김

• 실행 컨텍스트는 스택 구조로 쌓였다가 빠짐

실행 컨텍스트가 생성되는 조건

1. 전역 코드가 실행 될 때

   • 자바스크립트는 싱글 스레드이기 때문에, 전역 실행 컨텍스트는 1개만 존재

2. 함수가 호출될 때

   • 함수 하나당 컨텍스트 하나

실행 컨텍스트의 구성 요소

실행 컨텍스트 작동 방식 - 스택

• 실행 컨텍스트 스택(Execution Context Stack) 혹은 콜스택(Call Stack)이라 부름

// @example - 실행 순서
// 1. 전역 컨텍스트 생성 → greet() 실행
// 2. greet() 컨텍스트 생성 → sayHello() 실행
// 3. sayHello() 컨텍스트 생성 → 콘솔 출력
// 4. sayHello() 끝 → 컨텍스트 제거
// 5. greet() 끝 → 컨텍스트 제거
// 6. 전역 컨텍스트만 남음

function sayHello() {
  console.log("Hello!");
}

function greet() {
  sayHello();
}

greet();

호이스팅

전역 creation 단계에서 함수 선언을 메모리에 배치하는 동안 변수 선언에 undefined 기본 값을 할당하는 것을 '호이스팅'이라 부른다.

스코프 체인

현재 실행 중인 컨텍스트와 외부 렉시컬 환경의 연결을 유지한다. 변수를 참조할 때 현재 컨텍스트에서 찾지 못하면 외부 환경으로 범위를 넓혀가며 변수를 찾는다.

참조

• The Ultimate Guide to Hoisting, Scopes, and Closures in JavaScript