실행 컨텍스트(Execution Context)는 scope, hoisting, this, function, closure 등의 동작 원리를 담고 있는 JavaScript의 핵심 원리이다.
실행 컨텍스트는 실행 가능한 코드를 형상화하고 구분하는 추상적인 개념이라고 정의된다.
즉 실행 컨텍스트는 실행 가능한 코드들이 실행되기 위한 환경이라 볼 수 있다.
JavaScript 엔진은 코드를 실행하기 위해 실행에 필요한 아래의 정보를 알고 있어야 한다.
이와 같이 실행에 필요한 정보를 형상화하고 구분하기 위해 자바스크립트 엔진은 실행 컨텍스트를 물리적 객체의 형태로 관리한다.
var x = 1;
function outer () {
var y = 2;
function inner () {
var z = 3;
console.log(x + y + z);
}
inner();
}
outer();
위 코드를 실행하면 아래와 같이 실행 컨텍스트 스택(Stack)이 생성하고 소멸한다.
현재 실행 중인 컨텍스트에서 이 컨텍스트와 관련 없는 코드(예를 들어 다른 함수)가 실행되면 새로운 컨텍스트가 생성된다. 이 컨텍스트는 스택에 쌓이게 되고 컨트롤(제어권)이 이동한다.
script
요소를 처음 만나는 시점에서 전역 실행 컨텍스트가 생성되고 실행 컨텍스트에 쌓인다. 전역 실행 컨텍스트는 애플리케이션이 종료될 때(웹 페이지에서 나가거나 브라우저를 닫을 때)까지 유지된다.실행 컨텍스트는 실행 가능한 코드를 형상화하고 구분하는 추상적인 개념이지만 물리적으로는 객체의 형태를 가지며 아래의 3가지 프로퍼티를 소유한다.
실행 컨텍스트가 생성되면 자바스크립트 엔진은 실행에 필요한 여러 정보들을 담을 객체를 생성한다. 이를 Variable Object(VO / 변수 객체)라고 한다.
Variable Object는 아래의 정보를 담는 객체이다.
Variable Object는 유일하며 최상위에 위치하고 모든 전역 변수, 전역 함수 등을 포함하는 전역 객체(Global Object / GO)를 가리킨다. 전역 객체는 전역에 선언된 전역 변수와 전역 함수를 프로퍼티로 소유한다.
Variable Object는 Activation Object(AO / 활성 객체)를 가리키며 매개변수와 인수들의 정보를 배열의 형태로 담고 있는 객체인 arguments object가 추가된다.
스코프 체인(Scope Chain)은 일종의 리스트로서 현재 활성화된 실행 컨텍스트(AO)의 변수객체부터 전역 실행 컨텍스트의 변수 객체(GO)를 가리키는 형태로 구성된다.
JavaScript 엔진은 스코프 체인을 통해 렉시컬 스코프를 파악한다.
함수가 중첩되어 있으면 중첩될 때마다 부모 함수의 Scope가 자식 함수의 스코프 체인에 포함된다. 함수 실행중에 변수를 만나면 그 변수를 우선 현재 Scope, 즉 AO에서 검색해보고, 만약 검색에 실패하면 스코프 체인에 담겨진 순서대로 그 검색을 이어가게 되는 것이다.
JavaScript 엔진이 변수를 찾는(look-up) 과정은 스코프 체인을 통해 이루어지며 이는 함수가 어떻게 호출되던 오직 선언에만 의존한다는 것을 알 수 있다.
this 프로퍼티에는 this 값이 할당된다. this에 할당되는 값은 함수 호출 패턴에 의해 결정된다.