[JavaScript] 실행 컨텍스트

실행 컨텍스트

실행 컨텍스트란?

실행할 코드에 제공할 환경 정보를 모아놓은 객체를 말함.
동일한 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성하고, 이를 콜스택에 쌓아 올렸다가 가장 위에 있는 컨텍스트와 관련된 코드를 실행하는 식으로 전체 코드의 환경과 순서를 보장함

예시

var a = 1;

function outer() {
    function inner() {
        console.log(a) // undefined
        var a = 3;
    }
    inner()
    console.log(a) // 1

}

outer()
console.log(1)

1. 전역 컨텍스트 (Global Execution Context):

• 변수:
  • a: 1 (전역 변수로 선언 및 할당)
• 함수:
  • outer: 함수 선언문으로 정의된 outer 함수

2. outer 함수 컨텍스트:

• 변수:
  • inner: 함수 선언문으로 정의된 inner 함수 (호이스팅에 의해 함수 선언부만 끌어올려짐)

3. inner 함수 컨텍스트:

• 변수:
  • a: undefined (변수 선언은 호이스팅에 의해 최상단으로 올라가지만, 아직 초기화되지 않았기 때문에 undefined로 설정)

 

실행 컨텍스트가 활성화될 때 자바스크립트 엔진은 해당 컨텍스트에 관련된 코드들을 실행하는데 필요한 환경 정보를 수집해서 실행 컨텍스트 객체에 저장함. 이 객체는 자바스크립트 엔진이 활용할 목적으로 생성할 뿐 개발자가 확인할 수 없음.

실행 컨텍스트에 담기는 정보들은 다음과 같음

• variableEnvironment : 현재 컨텍스트 내의 식별자들에 대한 정보 + 외부 환경 정보, 선언 시점의 LexicalEnvironment의 스냅샷으로, 변경 사항은 반영되지 않음
• LexicalEnvironment : 처음에는 variableEnvironment와 같지만 변경 사항이 실시간으로 반영됨
• ThisBinding : this 식별자가 바라봐야 할 대상 객체

VariableEnvironment과 LexicalEnvironment의 차이점

• VariableEnvironment과 LexicalEnvironment는 둘 다 environmentRecord, outerEnvironmentReference로 구성되어 있음

environmentRecord(=Record)

• 현재 컨텍스트와 관련된 코드의 식별자 정보를 기록함
• 기록하는 정보 : 함수에 지정된 매개변수 식별자, 함수자체, var로 선언된 변수 식별자 등
• 관련 개념: #1 중 호이스팅
  자바스크립트 엔진이 현재 컨텍스트와 관련된 식별자 정보를 기록하는데, 호이스팅은변수 정보 정보 수집과정을 이해하기 쉽게 설명한 가상개념을 의미함

outerEnvironmentReference(=outer)
outer는 현재 호출된 함수가 선언될 당시의 LexicalEnvironment를 참조

예시

var a = 1;
var outer = function() {
    var inner = function() {
        console.log(a); // undefined
        var a = 3;
    };
    inner();
    console.log(a); // 1
};
outer();
console.log(a); // 1

위의 예시를 콜 스택으로 그리자면 아래와 같음

| inner 컨텍스트 |
| outer 컨텍스트 |
| 전역 컨텍스트 |
ㅡㅡㅡㅡㅡㅡㅡㅡ

outer의 실행컨텍스트가 생성될 때의 환경은 전역 컨텍스트임 -> 따라서 outer의 outerEnvironmentReference는 전역 컨텍스트의 LexicalEnvironment를 참조하게 됨.
inner의 실행 컨텍스트가 생성될 때의 환경은 outer임 -> 따라서 inner의 outerEnvironmentReference는 outer 컨텍스트의 LexicalEnvironment를 참조함

=> 왜 호출된 함수가 선언될 당시의 LexicalEnvironment를 참조할까? => 선언될 때의 변수나 식별자 등의 정보를 참조하기 위해서

즉, 각각의 실행 컨텍스트는 LexicalEnvironment 안에 record와 outer를 가지고 있고, outer 안에는 그 실행 컨텍스트가 선언될 당시의 LexicalEnvironment정보가 다 들어있음 -> scope chain에 의해 상위 컨텍스트의 record를 읽어올 수 있다.

스코프체이닝

• 식별자의 유효범위를 안에서부터 바깥으로 차례로 검색해나가는 것

 

차이점으로는 VariableEnvironment는 실행 컨텍스트가 생성될 때의 초기 스냅샷을 가지고 있음. 이후에 VariableEnvironment의 environmentRecord는 변수 등의 값이 바뀌어도 반영되지 않음

LexicalEnvironment는 실시간으로 변경된 사항을 반영함. 즉, LexicalEnvironment의 environmentRecord는 변수 등의 값이 바뀌면 실시간으로 반영함