실행 컨텍스트를 들어 본 적 있나요?

실행 컨텍스트(Execution Context)는 자바스크립트 코드가 실행될 때 만들어지는 “실행 환경 정보”의 묶음입니다. 어떤 변수와 함수에 접근할 수 있는지, this는 무엇인지 같은 정보를 담습니다. 호이스팅·스코프·this의 동작이 모두 이 개념 위에서 설명됩니다.

실행 컨텍스트의 종류

• 전역 실행 컨텍스트 — 코드가 처음 실행될 때 하나 생성됩니다.
• 함수 실행 컨텍스트 — 함수가 호출될 때마다 새로 생성됩니다.

각 컨텍스트는 대략 세 가지 정보를 가집니다.

• 변수 환경/렉시컬 환경 — 그 컨텍스트의 변수·함수 선언과 바깥 스코프로의 참조(스코프 체인).
• this 바인딩 — 현재 컨텍스트의 this 값.

콜 스택으로 관리된다

실행 컨텍스트는 콜 스택(call stack) 에 쌓입니다. 함수를 호출하면 그 함수의 컨텍스트가 스택에 push되고, 함수가 끝나면 pop됩니다. 가장 위에 있는 컨텍스트가 현재 실행 중인 코드입니다.

function first() {
  second();
  console.log('first 끝');
}
function second() {
  console.log('second 실행');
}
first();
// 콜 스택: [전역] → [전역, first] → [전역, first, second]
// second 종료 → [전역, first] → first 종료 → [전역]
// 출력: 'second 실행' → 'first 끝'

생성 단계와 실행 단계

각 실행 컨텍스트는 두 단계를 거칩니다.

1. 생성 단계 — 변수·함수 선언을 메모리에 등록하고 this를 결정합니다. 이때 var는 undefined로 초기화되고, let/const는 등록되지만 초기화 전이라 TDZ에 들어갑니다. 이것이 호이스팅의 실체입니다.
2. 실행 단계 — 코드를 한 줄씩 실행하며 변수에 값을 할당하고 함수를 호출합니다.