실행 컨텍스트

실행 컨텍스트란?

• 자바스크립트에서 실행 컨텍스트(Execution Context) 는 코드가 실행되는 환경
• 즉, 변수나 함수가 “어디에 속해 있고, 어떻게 접근 가능한지”를 결정하는 핵심 메커니즘이다.

---

실행 컨텍스트의 종류

실행 컨텍스트는 크게 전역 실행 컨텍스트와 함수 실행 컨텍스트로 나뉜다.

🧩 1. 전역 실행 컨텍스트 (Global Execution Context)

• 자바스크립트 코드가 처음 실행될 때 자동으로 생성된다.
• 프로그램 전체를 감싸는 최상위 컨텍스트로, 전역에 선언된 변수와 함수가 모두 포함된다.
• 프로그램이 종료될 때까지 유지되며, 브라우저 환경에서는 window 객체, Node.js에서는 global 객체가 전역 객체로 사용된다.

전역 실행 컨텍스트는 단 하나만 존재한다. (js는 싱글스레드)

🧩 2. 함수 실행 컨텍스트 (Function Execution Context)

• 함수가 호출될 때마다 새롭게 생성된다.
• 각 함수는 자신만의 실행 컨텍스트를 가지며, 이 컨텍스트 내에서 선언된 변수와 함수는 해당 함수 내에서만 유효하다.
• 함수가 종료되면 실행 컨텍스트도 함께 사라진다

즉, 실행 컨텍스트는 함수 호출 시마다 쌓였다가(LIFO 구조), 함수가 끝나면 스택에서 제거된다.

---

실행 컨텍스트는 어떤 구성 요소로 이루어져 있나요? 🤔

1️⃣ 변수 객체 (Variable Object)

• 실행 컨텍스트 내에서 사용되는 변수와 함수 선언을 저장하는 공간
• 전역 컨텍스트에서는 전역 객체(Global Object)가 변수 객체의 역할을 하고,
  함수 컨텍스트에서는 활성 객체(Activation Object)가 사용된다.

function greet(name) {
  var message = "Hello " + name;
  console.log(message);
}

위 예시에서 name, message, 그리고 greet 함수 자체가 모두 변수 객체 안에 저장된다.

2️⃣ 스코프 체인 (Scope Chain)

• 변수를 찾을 때 현재 컨텍스트 → 외부 렉시컬 환경으로 확장해 나가는 연결 구조다.
• 현재 스코프에서 변수를 찾지 못하면 상위 스코프를 따라가며 탐색한다.

var x = 1;
function outer() {
  var y = 2;
  function inner() {
    console.log(x + y);
  }
  inner(); // 3
}
outer();

inner() 함수에서 x를 찾지 못하면 상위 스코프(outer)를, 그 다음에는 전역 스코프까지 올라가 x를 찾아낸다. 이렇게 연결된 구조가 바로 스코프 체인이다.

3️⃣ this

• this는 실행 컨텍스트에 따라 참조하는 객체가 달라진다.

컨텍스트	this 값
전역 컨텍스트	전역 객체 (window / global)
함수 호출	전역 객체 (strict mode에서는 undefined)
메서드 호출	메서드를 소유한 객체
생성자 함수 호출	새로 생성되는 인스턴스

function showThis() {
  console.log(this);
}

showThis(); // window (strict mode라면 undefined)

---

실행 컨텍스트의 동작 과정

1. 전역 코드가 실행되면 전역 컨텍스트가 생성된다.
2. 함수가 호출될 때마다 새로운 함수 실행 컨텍스트가 스택에 쌓인다.
3. 함수 실행이 끝나면 해당 컨텍스트가 스택에서 제거된다.

이렇게 실행 컨텍스트 스택(Execution Stack) 을 통해 자바스크립트는 코드의 실행 순서를 관리한다.

---

Reference

이 포스트는 아래 게시글의 정보 및 이미지가 사용되었습니다.

1. [10분 테코톡] 💙 하루의 실행 컨텍스트

---

END