TIL-2024.02.27 - JS - 실행 컨텍스트-4. 렉시컬 환경-3

 

2.1.2 선언적 환경 레코드 생성 

- let, const 전역 변수는 선언적 환경 레코드에 등록되고 관리. 

- let, const 로 선언한 전역 변수는 전역 객체의 프로퍼티가 되지않고, 개념적인 블록 내에 존재하게 되는데. 이를 전역 환경의 선언적 환경 레코드라 함. 

 

 

2.2. this 바인딩 

- 전역 환경 레코드의 내부 슬롯에 this가 바인딩. 

- 전역 코드에서 this 는 전역 객체를 가리키므로 전역 환경 레코드의 내부 슬롯에는 전역 객체가 바인딩. 

- 전역 코드에서 this를 참조하면 전역 환경 레코드의 내부슬록에 바인딩되어있는 객체가 반환. 

 

2.3. 외부 렉시컬 환경에 대한 참조 결정 (상위 스코프와의 스코프 체인) 

- 외부 렉시컬 환경에 대한 참조는 현재 평가 중인 소스코드를 포함함는 외부 소스코드의 렉시컬 환경, 즉 상위 스코프

- 현재 평가 중인 소스코드는 전역 코드다. 

 

3. 전역 코드 실행.

- 변수 할당문이 실행되어 전역 변수 x, y에 값이 그리고 foo 함수가 호출.

- 할당문 혹은 호출문이 실행되려면, 변수 | 함수 이름이 선언된 식별자인지 확인.

- 이 과정에서, 동일한 이름의 식별자가 다른 스코프에 있는지 등을 파악하는데, 어느 스코프의 식별자를 참조하면 되는지 결정하는 것을 식별자 결정이라함 

- 식별자 결정을위해 식별자를 검색할 때는 실행중인 실행 컨텍스트에서 식별자를 검색하기 시작하는데, 선언된 식별자는 실행 컨텍스트의 렉시컬 환경의 환경 레코드에 등록. 

- 만약 찾을 수 없는 경우 외부 렉시컬 환경에 대한 참조가 가리키는 렉시컬환경, 즉 상위 스코프로 이동하여 찾음. 

 

 

 

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); // 20 + 10 + 3 + 4 + 5
    }
    bar(10);
}
foo(20); // 42

 

 

예제 설명: 
1. 함수 실행 컨텍스트 생성

2. 함수 렉시컬 환경 생성 
   2.1. 함수 환경 레코드 생성 
   2.2. this 바인딩
   2.3. 외부 렉시컬 환경에 대한 참조 결정 

 

 

1. 함수 실행 컨텍스트 생성: 
- foo함수 실행 컨텍스트 생성하며, 렉시컬 환경이 완성된 다음, 실행 컨텍스트 스택에 푸시. 
- 이때, foo 함수 실행 컨텍스트는 실행 컨텍스트 스택의 최상위, 실행중인 컨텍스트 됨. 

 

2. 함수 렉시컬 환경 생성: 

-함수 렉시컬 환경을 생성하고 foo 함수 실행 컨텍스트에 바인딩 함

 

   2.1. 함수 환경 레코드 생성: 

- 함수 렉시컬 환경을 구성하는 컴포넌트 중 하나인 함수 환경 레코드는 매개변수, 객체, 함수 내부에 선언한 지역 변수와 중첩함수를 등록하고 관리

 

   2.2 this 바인딩:

- foo 함수는 일반 함수로 호출되었기에, this는 전역 객체를 가리킴.

- 함수 환경 레코드 내부 슬롯에는 전역 객체가 바인딩. 

 

   2.3 외부 렉시컬 환경에 대한 참조 결정: 

- foo 함수 정의가 평가된 시점에 실행 중인 실행 컨텍스트의 렉시컬 환경의 참조가 할당된다.
- 즉, foo 함수 정의는 전역 코드 평가 시점에 평가되는데, 이 시점의 실행 중인 실행 컨텍스트는 전역 실행 컨텍스트이므로, 외부 렉시컬 환경에 대한 참조에는 전역 렉시컬 환경 참조가 할당.

 

3. foo 함수 실행

   > 3.1 bar 함수 코드 평가

   > 3.2 bar 함수 코드 실행
       -3.2.1. console 식별자 검색  (스코프 체인을 통해 전역 렉시컬 환경으로 이동)
       -3.2.2. log 메서드 검색
       -3.2.3. a + b + x + y + z 평가

       -3.2.4. a + b + x + y + z 호출
       -3.2.5. bar 함수 코드 실행 종료

  > 3.3. foo 함수 실행 종료

4. 전역 코드 실행 종료