실행 컨텍스트 (Execution Context)

JavaScript에서 실행 컨텍스트는 코드를 실행하기 위한 환경을 구성하고, 변수나 함수 등의 식별자를 추적하며 실행 흐름을 관리함

📁 코드 타입에 따른 실행 컨텍스트

ECMAScript 사양은 JavaScript 소스코드를 아래 4가지 타입으로 구분함.

• 전역 코드 (Global Code)

  • 전역 스코프를 생성
  • var, 함수 선언문으로 정의된 식별자는 전역 객체에 프로퍼티로 등록

• 함수 코드 (Function Code)

  • 지역 스코프 생성
  • 매개변수, 지역 변수, arguments 객체를 관리

• eval 코드

  • strict 모드에서 독립적 스코프 생성

• 모듈 코드

  • 파일 단위로 독립적인 모듈 스코프 구성

⚙️ 실행 컨텍스트란?

실행 컨텍스트는 JavaScript 코드 실행을 위한 환경 정보를 담고 있는 일종의 내부 레코드

구성 요소:

• 렉시컬 환경 (Lexical Environment):
  식별자를 등록하고 검색하는 구조이며, 내부적으로 환경 레코드와 외부 렉시컬 참조로 나

• 실행 컨텍스트 스택 (EC Stack):
  실행 순서를 제어하는 스택 구조로, 현재 실행 중인 컨텍스트는 항상 스택의 최상단에 존재

🌍 전역 코드 평가 과정

1. 전역 실행 컨텍스트 생성

• 최초 실행 시, 전역 실행 컨텍스트 생성 → 스택에 push

2. 전역 렉시컬 환경 생성

• 환경 레코드

  • var, 함수 선언은 객체 환경 레코드에 등록 → 전역 객체에 프로퍼티로 바인딩
  • let, const는 선언적 환경 레코드에 등록 → TDZ(Temporal Dead Zone) 존재 <uninitialized>, 레퍼런스 오류 발생

• this 바인딩

  • 전역 컨텍스트의 this는 전역 객체(window, global, globalThis)를 참조

• 외부 렉시컬 환경 참조

  • 최상위 스코프이므로 참조는 null

🧠 식별자 결정 (Identifier Resolution)

변수, 함수 등을 사용할 때 해당 식별자를 어디서 정의했는지 탐색하는 과정

• 현재 컨텍스트의 렉시컬 환경 → 외부 참조 순으로 탐색
• 끝까지 찾지 못하면 ReferenceError 발생

🧩 함수 코드 실행 컨텍스트

함수 호출 시, 아래 순서로 진행

1. 함수 실행 컨텍스트 생성

• 호출 시 기존 실행 중인 컨텍스트는 일시 중단됨
• 새로운 함수 실행 컨텍스트가 스택에 push

2. 함수 렉시컬 환경 구성

• 함수 환경 레코드 생성
  • 매개변수, arguments 객체, 지역 변수, 내부 함수 등 저장
• this 바인딩
  • 호출 방식에 따라 바인딩 대상이 달라짐
    • 일반 호출: 전역 객체
    • 생성자 호출: 새 인스턴스 객체
• 외부 렉시컬 참조
  • 함수 정의 당시의 상위 스코프를 기억 ([[Environment]])

3. 함수 실행

• 인자 할당 → 내부 코드 실행 → return 처리

4. 함수 종료

• 실행 완료되면 함수 컨텍스트는 스택에서 pop
• 제어권이 이전 컨텍스트로 복귀

🧪 식별자 결정

var globalVar = 1;

function testFunc() {
    var localVar = 2;
    console.log(globalVar + localVar);
}
testFunc(); // 출력: 3

현재 함수 스코프부터 검색하여 최상위 스코프까지 탐색함. 이 때, 검색에 실패하면 참조 오류가 발생함. 예를 들어 console.log(전역 변수 + 함수 내부 지역 변수) 일 경우 console에 대한 식별자 결정을 위해 스코프 참조를 타고 전역 객체까지 올라가서 결정 후 프로퍼티, 메서드에서 log를 찾고 전역 변수 식별자 결정을 위해 전역 스코프를 검색하는 방식

• console → 전역 객체 탐색
• globalVar → 전역 스코프에서 발견
• localVar → 함수 렉시컬 환경에서 발견