a.k.a. 실행 컨텍스트

JS의 동작원리 뿌수기 👊

실행 컨텍스트 정의

소스코드를 실행하는 데 필요한 환경 제공 & 코드의 실행 결과를 실제로 관리하는 영역

식별자(변수, 함수, 클래스, etc.)를 등록·관리하는 스코프 & 코드 실행 순서 관리를 구현한 내부 메커니즘

실행 컨텍스트 == 실행 컨텍스트 렉시컬 환경 + 실행 컨텍스트 스택

• 렉시컬 환경: 식별자 & 스코프 관리
• 실행 컨텍스트 스택: 코드 실행 순서 관리

소스코드(ES code)의 타입에 따라 실행 컨텍스트의 타입 상이

소스코드의 타입에 따라 실행 컨텍스트 생성 과정 & 관리 내용 상이

• 전역 코드 - 전역 실행 컨텍스트 💥
• 함수 코드 - 함수 실행 컨텍스트 💥
• eval 코드 - eval 실행 컨텍스트
• 모듈 코드 - 모듈 실행 컨텍스트 💥

※ 💥: 자주 본 소스코드

소스코드의 평가 & 실행

'평가'를 이럴 때 쓰는 표현이란 것을 새삼 알게 되었다..

• JS 엔진 메커니즘

1. 소스코드를 마주쳤다
2. 소스코드 평가 (선언문 읽고 실행)
   • 실행 컨텍스트 생성(보통 전역 first, 함수 after)
   • 선언문 실행(변수, 함수, etc.)
   • 변수 or 함수 식별자 등록
     (@where? 실행 컨텍스트가 관리하는 스코프
     == 렉시컬 환경의 환경 레코드
     , 변수or함수 식별자가 key)
3. 소스코드 실행 (선언문 제외) ▶ 런타임 시작
4. 실행 시 필요한 변수 or 함수 정보를 위 스코프에서 참조
5. 실행 결과(변경된 변수 or 함수 값·정보) 위 스코프에 재등록

📌 런타임 끝날 때까지 3~5 반복
📌 큰 과정: 소스코드 평가 → 소스코드 실행

💣 ~~~is not defined. 에러가 나는 이유

• 변수 할당이 제대로 안 됐거나
• 평가 과정에 없던 변수가 존재하여 참조 불가
  (평가 과정에서 변수는 undefined로 있음)

실행 컨텍스트 스택(JS: only one)

• 코드의 실행 순서 관리
• 평가된 소스코드: 실행 컨텍스트 생성 → 실행 컨텍스트 스택에 push → 최상위 위치
• 실행 컨텍스트 스택의 최상위 실행 컨텍스트: 실행 중인 실행 컨텍스트(running execution context)

렉시컬 환경(Lexical Environment)

• 식별자 검색(참조)하는 곳
• 스코프 & 식별자 관리
• 실행 컨텍스트's 구성 컴포넌트 中 1. (VariableEnvironment 컴포넌트도 有..지만 걍 렉시컬만이라도 제대로 알자)
• 식별자
  & 식별자에 바인딩된 값
  & 상위 스코프에 대한 참조
  를 기록·저장하는 자료구조

식별자 뜯어보기

• 전역/함수/블록 스코프
• key(식별자) & value(식별자에 바인딩된 값)로 이루어진 객체 형태

렉시컬 환경 == 환경 레코드 + 외부 렉시컬 환경 참조

• 환경 레코드: 스코프에 포함된 식별자 등록 & 식별자에 바인딩된 값 관리
• 외부 렉시컬 환경 참조(Outer Lexical Environment Reference): 상위 스코프(== 외부 렉시컬 환경, 해당 실행 컨텍스트를 생성한 소스코드's 상위 코드's 렉시컬 환경) 참조
  📌 이 참조가 이어진 것이 스코프 체인(Singly Linked List)!!!!

렉시컬 스코프(정적 스코프)

JS Engine's 상위 스코프 결정
함수를 어디서 호출했는가? (X)
함수를 어디에 정의했는가? (O)

📌 렉시컬 환경의 상위 스코프에 대한 참조는 함수 정의가 평가되는 시점에 함수가 정의된 환경(위치)에 의해 결정됨.