-
[자바스크립트 중고급] Execution Context개인 공부/JavaScript 2022. 1. 5. 10:03
Execution Context
- 함수가 실행되는 영역, 묶음
- 함수 코드를 실행하고 실행 결과를 저장한다.
- 스펙상의 사양이다.
- 함수를 호출하면 엔진은 실행 콘텍스트를 생성하고 실행 콘텍스트 안은로 이동한다.
실행 콘텍스트 실행 단계
- 준비 단계
- 초기화 단계
- 코드 실행 단계
Execution Context 생성 시점
- 실행 가능한 코드를 만났을 때
- 여기서 실행 가능한 코드란
- 함수 코드, 글로벌 코드, eval 코드를 가리킨다.
코드 유형을 분리한 이유
- 실행 콘텍스트에서 처리 방법과 실행 환경이 다르기 때문이다.
- 함수 코드: 렉시컬 환경
- 글로벌 코드: 글로벌 환경
- eval 코드: 동적 환경
실행 콘텍스트의 상태 컴포넌트
- 실행 콘텍스트 상태를 위한 오브젝트이다.
- 실행 콘텍스트 안에 생성된다.
- 상태 컴포넌트 유형
- Lexical Environment Component(LEC)
- Variable Environment Component(VEC)
- This Binding Component(TBC)
렉시컬 환경 컴포넌트
- 함수와 변수의 식별자 해결을 위한 환경을 설정한다.
- 함수 초기화 단계에서 해석한 함수와 변수를 {name: value} 형태로 저장한다.
- 이름으로 함수와 변수를 검색할 수 있게 된다.
- 함수 밖의 함수와 변수 참조 환경 설정
- 함수 밖의 함수와 변수를 사용할 수 있게 된다.
렉시컬 환경 컴포넌트 구성
- function, with, try-catch에서 구성된다.
- 컴포넌트 구성
- 환경 레코드 (ER: Environment Record)
- 외부 렉시컬 환경 참조 (OLER: Outer Lexical Envrionment Reference)
렉시컬 환경 컴포넌트 설정
- 환경 레코드에 함수 안의 함수와 변수를 기록한다.
- 외부 렉시컬 환경 참조에 function 오브젝트의 [[Scope]]를 설정한다.
- 따라서 함수 안과 밖의 함수와 변수를 사용할 수 있게 된다.
외부 렉시컬 환경 참조
- 스코프와 실행 중인 함수가 Context 혀애이므로 스코프의 변수와 함수를 별도의 처리 없이 즉시 사용할 수 있다.
- 실행 콘텍스트에서 함수 안과 밖의 함수, 변수를 사용할 수 있으므로 함수와 변수를 찾기 위해 실행 콘텍스트를 벗어나지 않아도 된다.
변수 환경 컴포넌트
- 실행 콘텍스트 초기화 단계에서 렉시컬 환경 컴포넌트와 같게 설정된다.
- 이렇게 하는 이유는 초깃값을 복원할 때 사용하기 위함이다.
- 함수 코드가 실행되면 실행 결과를 렉시컬 환경 컴포넌트에 설정한다. 초깃값이 변하게 되므로 이를 유지하기 위한 것이다.
환경 레코드
환경 레코드 구성
- 환경 레코드를 구분하는 이유
- 기록 대상에 따라 다르기 때문이다.
- 선언적 환경 레코드
- DER: Declarative Environment Record
- function, 변수, catch 문에서 사용한다.
- 오브젝트 환경 레코드
- OER: Object Envirionment Record
- 글로벌 함수와 변수, with문에서 사용한다.
- 정적이 아니라 동적이기 때문이다.
글로벌 환경(Global Environment)
- 글로벌 오브젝트에서 사용한다.
- 렉시컬 환경 컴포넌트와 형태가 같다.
- 동적으로 함수와 변수를 바인딩한다.
- 함수에서 var 키워드를 사용하지 않고 변수를 선언하면 글로벌 오브젝트에 설정되기 때문이다.
- 이런 이유로 오브젝트 환경 레코드를 사용한다.
- 외부 렉시컬 환경 참조 값은 null이다.
this 바인딩 컴포넌트
- 목적
- this로 함수를 호출한 오브젝트의 프로퍼티에 액세스
- 예: this.propertyName
- 액세스 매커니즘
- obj.book() 형태에서
- this로 obj를 참조할 수 있도록
- this 바인딩 컴포넌트에 obj 참조를 설정한다.
- obj의 프로퍼티가 변경되면 동적으로 참조한다.
- 설정(할당)이 아닌 참조이기 때문이다.
호출 스택(call stack)
- 실행 콘텍스트의 논리적 구조
- First In Last Out 순서
- 함수가 종료되면 스택에서 빠져나온다.
- 가장 아래에는 글로벌 오브젝트의 함수가 위치한다.
- JS는 싱글 스레드이기 때문에 이런 논리가 가능하다.
파라미터 매핑
함수 호출
- 함수가 호출되면 3개의 파라미터 값을 실행 콘텍스트로 넘겨 준다.
- 함수를 호출한 오브젝트
- 함수 코드
- 호출한 함수의 파라미터 값
- 함수를 호출한 오브젝트 값을 this 바인딩 컴포넌트에 설정하여 this로 참조한다.
- 함수 코드는 function 오브젝트의 [[Code]]에 설정되어 있다.
- 호출한 함수의 파라미터 값을 호출된 함수의 Argument 오브젝트에 설정한다.
파라미터 값 매핑
- 호출한 함수에서 넘겨 준 파라미터의 값을 호출된 함수의 파라미터 작성 순서에 맞추어 값을 매핑하는 것
- 엔전 처리 관점에서는 실행 콘텍스트로 넘겨준 파라미터 값과 function 오브젝트의 [[FormalParameters]]에 작성된 이름에 값을 매핑하고 결과를 선언적 환경 레코드에 설정하는 것이다.
'개인 공부 > JavaScript' 카테고리의 다른 글
[자바스크립트 중고급] this, 논리적 정리 (0) 2022.01.13 [자바스크립트 중고급] function instance (0) 2022.01.13 [자바스크립트 중고급] Argument, 스코프 (0) 2022.01.05 [자바스크립트 중고급] Function 오브젝트 (0) 2022.01.05 [자바스크립트 비기너] Boolean 오브젝트, 자바스크립트 특징, JSON, Date, Math 오브젝트 (0) 2021.12.02