실행할 코드에 제공할 환경 정보들을 모아놓은 객체로, 자바스크립트의 동적 언어로서의 성격을 가장 잘 파악할 수 있는 개념이다.
먼저 실행 컨텍스트를 알아보기에 앞서 스택과 큐의 개념을 먼저 살펴보자
스택은 선입후출, 비어있는 스택에 순서대로 데이터 a,b,c,d를 저장하면 꺼낼때엔 d,c,b,a의 순서로 꺼내는 방식이다.
반대로 큐는 선입선출, 비어있는 큐에 a,b,c,d의 순서로 저장하면 꺼낼때엔 a,b,c,d의 순서로 꺼내는 방식이다.
앞서 실행 컨텍스트를 실행할 코드에 제공할 환경 정보들을 모아놓은 객체라고 했다.
동일한 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성하고, 이를 콜 스택에 쌓아 올렸다가, 가장 위에 쌓여있는 컨텍스트와 관련있는 코드들을 실행하는 식으로 환경과 순서를 보장한다.
// -- (1)
var a = 1;
function outer(){
function inner(){
console.log(a); // undefined
var a = 3;
}
inner(); // --(2)
console.log(a); // 1
}
outer(); // --(3)
console.log(a); //1
위 코드를 실행하면 (1) 전역 컨텍스트가 콜 스택에 담긴다.
(3)에서 outer 함수를 호출하면 자바스크립트 엔진은 outer에 대한 환경 정보를 수집해서 outer 실행 컨텍스트를 생성한 후 콜 스택에 담는다.
outer 실행 컨텍스트가 맨 위에 놓였으므로 전역 컨텍스트는 중단하고 outer 함수 내부의 코드를 실행한다.
(2)에서 inner 함수의 실행 컨텍스트가 콜 스택의 가장 위에 담기면 outer 컨텍스트가 중단되고
inner 함수 내부의 코드를 순서대로 실행한다.
inner 함수를 실행 후 inner 실행 컨텍스트가 콜 스택에서 제거 되고, outer 함수가 실행되고 컨텍스트가 콜 스택에서 제거 되고, 실행중인 함수가 없으므로 전역 컨텍스트가 콜 스택에서 제거된다.
실행 컨텍스트가 콜 스택의 가장 위에 있을 때가 현재 코드에 관여하게 되는 시점임을 알 수가 있다.
실행 컨텍스트가 활성화 되면 자바스크립트 엔진이 해당 컨텍스트에 관련된 코드들을 실행하는 데 필요한 환경 정보를 집어넣는다. 물론 이것은 자바스크립트엔진이 활요할 목적으로 생성 될 뿐이라 개발자가 따로 확인은 어렵다.
그럼 어떤 환경정보들이 들어가는지 살펴보자.
VariableEnvironment에 담기는 내용은 environmentRecord와 outerEnvironmentReference로 구성돼 있다.
LexicalEnvironment와 초기값은 동일하다.
environmentRecord에는 매개변수의 이름, 함수 선언, 변수명 등이 담긴다.
outerEnvironmentReference는 현재 호출 된 함수가 선언 될 당시의 LexicalEnvironment를 참조한다.