키워드
코드를 실행하는데 필요한 환경 정보
자바스크립트에서 코드가 실행되는데 필요한 환경 정보를 모아놓은 객체이다. 자바스크립트 엔진은 실행 컨텍스트에 있는 정보를 바탕으로 전체 코드의 환경과 순서를 보장한다.
코드가 실행이 되면 함수 실행마다 해당 함수의 실행 컨텍스트를 생성하게 되고, 자바스크립트 엔진은 이를 바탕으로 함수 호출 시 콜스택 실행 컨텍스트 정보를 차곡차곡 쌓게 된다.
자바스크립트 안에서 실행 컨텍스트가 생성되는 경우는 총 3가지 이다.
Global Object
에 의한 전역 실행 컨텍스트 Global execution context
Activation Object
에 의한 함수 실행 컨텍스트 Function execution context
Eval execution Context
라는 것이 있다는데 오늘날 거의 쓰이지 않는다고 한다.실행컨텍스트의 구성요소는 크게 3가지로 분류할 수 있다.
Variable Environment
: 함수 실행 컨텍스트의 초기 정보를 가지고 있다. 렉시컬 환경 Lexical Environment
과 동일하게, 환경 레코드 Environment Record
와 외부 환경 참조 Outer Environment Reference
값을 가지고 있다. 함수의 초기 정보를 Variable Environment
에 먼저 정보를 담고, Lexical Environment
가 이를 복사해 사용한다.Lexical Environment
: 함수 내부의 정보가 업데이트 되는 경우, Lexical Environment
에서 이를 반영한다.Environment Record
: 식별자 정보를 담당한다, 함수 내에서 선언한 변수나 매개 변수 이너 함수에 대한 정보가 실린다.Outer Environment Reference
: 현재 호출된 함수가 선언될 당시 Lexical Environment
를 참조한다. this binding
: Lexical Environment
와는 다르게 함수를 어디에서 어떠한 방식으로 호출했냐에 따라 참조하는 값이 달라진다.
Lexical Environemnt
의 참조와는 전혀 다른 개념이기에 우선은Lexical Environment
는 함수 선언 과정에서,this binding
은 함수 호출 과정에서 런타임으로 생성된다는 것을 기억하자.
this binding
에 대한 내용은 지난 시간 공부한 것을 참조하자.
this에 대해 설명해주세요
호이스팅은 선언문이 마치 최상단에 끌어올려진 듯한 현상으로 선언 타입이나 함수 선언 방식에 따라서 다른 결과를 가지게 된다.
var
를 사용한 변수 호이스팅creation phase
: 환경 레코드에 선언문을 저장한다. var
를 통해 선언을 했기 때문에 해당 식별자는 undefined
값을 가지게 된다.execution phase
undefined
을 출력하게 된다.let
, const
를 사용한 변수 호이스팅let
, const
로 선언했기 때문에 해당 식별자는 선언과 초기화가 따로 이루어지게 된다.reference error
가 나타나게 된다. TDZ
var
를 사용한 함수 표현식var
를 통해 선언을 했기 때문에 해당 식별자는 undefined
값을 가지게 된다.undefined
이 되게 된다. undefined
는 함수가 아니므로 type error
를 나타나게 된다.let
, const
를 사용한 함수 표현식let
, const
를 통해 선언 했기 때문에 해당 식별자에는 초기화가 설정되어 있지 않다.reference error
가 발생한다.함수의 실행 컨텍스트에서 식별자를 찾는 경우, 먼저 자신의 Environment Record
를 확인한다. 이 때 만약 찾는 식별자가 Environment Record
에 존재하지 않는 경우, Outer Environment Record
를 참조하기 시작한다. 이 때 순서는 inner → outer 순으로 탐색이 진행된다.
외부에서 한번 선언되었던 변수가 임의의 함수에서 재선언되는 경우, 외부 변수에 대한 정보를 읽어오지 못하는 경우를 말한다. encapsulation
을 통해 함수 내에서만 사용할 데이터 값을 재정의하는 경우, 나타날 수 있다.
참고
[ JavaScript ] 변수의 scope 와 Shadowing
[큰돌의 터전] 실행컨텍스트
[10분 테코톡] 💙 하루의 실행 컨텍스트