실행 컨텍스트

2024. 01. 26 > 2025. 06. 23 블로그 A/S 프로젝트🚧 로 추가한 글입니다.
예시를 다듬고, 오개념을 바로잡습니다.

 

실행 컨텍스트(execution context)란?

• 어떤 소스코드가 실행되는 단위.
• 함수에 있는 정보, 즉 렉시컬 환경(환경 레코드와 외부 렉시컬 환경에 대한 참조)을 참조!
  ** 환경 레코드 - 식별자와 바인딩된 값
• 이 실행 컨텍스트를 콜스택에 쌓아올린 후 실행하여 코드의 환경과 순서를 보장할 수 있게 된다.

---

실행 컨텍스트는 언제 생성될까?

하나의 실행 컨텍스트를 구성할 수 있는 소스코드의 종류는 다음과 같다. 이때 내부 코드는 포함하지 않는다. 그리고 평가 시점에 각각의 컨텍스트가 생성된다.

• 전역
• 함수
• eval() 함수
• 모듈

---

실행 컨텍스트와 콜스택, 렉시컬 환경

var x = 1;
const y = 2;

function foo(a) {
  var x = 3;
  const y = 4;

  function bar(b) {
    const z = 5;
    console.log(a + b + x + y + z);
  }
  bar(10);
}

foo(20);

 

1. 전역 객체 생성

• 빌트인 전역 프로퍼티(Infinity, NaN, undefined)
• 빌트인 전역 함수 (eval, isFinite, isNaN, parseFloat, parseInt, encodeURI/decodeURI/encodeURIComponent/decodeURIComponent)
• 표준 빌트인 객체
• 호스트 객체

 

2. 전역 코드 평가. 전역 실행 컨텍스트 생성. 전역 렉시컬 환경 생성. 호이스팅 및 바인딩.

• 전역 실행 컨텍스트는 생성되어 콜스택에 쌓인다.
• 전역 렉시컬 환경이 생성되어 전역 실행 컨텍스트에 바인딩된다.

2.1. 전역 렉시컬 환경의 환경 레코드 - 객체 환경 레코드의 BindingObject - 전역 객체

• foo는 선언문이므로 전역 객체의 메서드로 [foo 식별자 - 함수 객체] 바인딩이 이루어진다.
• x는 var 키워드로 선언되었으므로 전역 객체의 프로퍼티로 [x - undefined] 바인딩이 이루어진다.

2.2. 전역 렉시컬 환경의 환경 레코드 - 선언적 환경 레코드

• y는 const 키워드로 선언되었으므로 선언적 환경 레코드에 [y - <uninitialized>] 바인딩 (아직 값 바인딩 X)

2.3. this 바인딩

전역 렉시컬 환경의 환경 레코드의 [[GlobalThisValue]] 내부 슬롯에 전역 객체가 바인딩된다.

2.4. 외부 렉시컬 환경에 대한 참조 결정

전역 렉시컬 환경은 스코프 체인의 종점. null 할당.

 

3. 전역 코드 실행

식별자 검색은 현재 실행 중인 실행 컨텍스트에서 이루어진다.

즉 전역 실행 컨텍스트의 렉시컬 환경에서 x, y, foo에 대한 검색을 시작한다.

 

4. foo 함수 호출, 전역 코드 실행 일시 중단, foo 함수 내부로 코드 제어권 이동

 

5. foo 함수 코드 평가. 함수 실행 컨텍스트 생성. 함수 렉시컬 환경 생성.

• 함수 실행 컨텍스트는 생성되어 콜스택에 쌓인다.
• 함수 렉시컬 환경이 생성되어 foo 실행 컨텍스트에 바인딩된다.

5.1. foo 함수 렉시컬 환경의 환경 레코드 생성

등록, 관리되는 것들은 다음과 같다.

• 매개변수
• arguments 객체
• 함수 내부의 지역 변수와 중첩 함수

5.2. this 바인딩

함수 렉시컬 환경의 환경 레코드의 [[ThisValue]] 내부 슬롯에 전역 객체가 바인딩된다.

5.3. 외부 렉시컬 환경에 대한 참조 결정

foo 함수가 "평가된 시점에 실행 중이었던 실행 컨텍스트"의 렉시컬 환경의 참조가 할당된다. 즉 전역 실행 컨텍스트의 렉시컬 환경의 참조가 할당된다.

 

6. foo 함수 코드 실행

식별자 검색은 현재 실행 중인 실행 컨텍스트에서 이루어진다.

즉 foo 함수 실행 컨텍스트의 렉시컬 환경에서 x, y, bar에 대한 검색을 시작한다.

 

7. bar 함수 호출, foo 함수 코드 실행 일시 중단, bar 함수 내부로 코드 제어권 이동

 

8. bar 함수 코드 평가. 함수 실행 컨텍스트 생성. 함수 렉시컬 환경 생성.

 

9. bar 함수 코드 실행

9.1. console 식별자 검색

스코프 체인을 타고 올라가 전역 렉시컬 환경의 객체 환경레코드에 올라간 BindingObject를 통해 전역 객체에서 찾을 수 있다.

9.2. log 메서드 검색

console 객체의 프로토타입 체인을 통해 검색하여 찾는다. log는 console이 가지고 있는 프로퍼티이다.

9.3. a + b + x + y + z의 평가

식별자를 스코프 체인을 통해 검색하여 찾는다.

9.4. console.log 메서드 호출

 

10. bar 함수 코드 실행 종료

• 콜스택에서 bar 함수 실행 컨텍스트가 팝된다.
• 이때, bar 함수 실행 컨텍스트에 의해 참조되고 있는 렉시컬 환경까지 소멸하는 것은 아니다. (누군가 참조하고 있다면 GC에 안들어감)

 

11. foo 함수 코드 실행 종료

 

12. 전역 코드 실행 종료