실행 컨텍스트(execution context)

실행 컨텍스트란?

- 실행할 코드에 제공할 환경 정보들을 모아놓은 객체. 
  (자바스크립트의 동적 언어로서의 성격을 가장 잘 파악할 수 있는 개념)

 

---

자바스크립트는 어떤 실행 컨텍스트가 활성화 되는 시점에 선언된 변수를 위로 끌어올리고(호이스팅 hoisting), 외부 환경 정보를 구성하고, this값을 설정하는 등의 동작을 수행하는데, 이로인해 다른 언어에서는 발견할 수 없는 특이한 현상이 발생합니다.

---

 

동일한 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성, 이를 콜 스택(call stack)에 쌓아 올렸다가, 가장 위에 쌓여있는 컨텍스트와 관련 있는 코드들을 실행하는 식으로 전체 코드의 환경과 순서를 보장합니다.

여기서 '동일한 환경', 즉 하나의 실행 컨텍스트를 구성할 수 있는 방법으로 전역공간, eval() 함수, 함수 등이 있습니다.

우리가 흔히 실행 컨텍스트를 구성하는 방법은 함수를 실행하는 것 뿐입니다.

*(ES6에서는 블록 {}에 의해서도 새로운 실행 컨텍스트가 생성됩니다.)

 

// --- (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

실행 컨텍스트 예제

---

 

 

콜 스택에 차례로 쌓이는 실행 컨텍스트

 

 

 

실행 순서. 콜 스택에 쌓인 역으로 출력된다.

 

스택 구조를 잘 생각해보면 한 실행 컨텍스트가 콜 스택의 맨 위에 쌓이는 순간이 곧 현재 실행할 코드에 관여하게 되는 시점임을 알 수 있다. → 기존의 컨텍스트는 새로 쌓인 컨텍스트보다 아래에 위치할 수 밖에 없기 때문이다.

 

실행 컨텍스트가 활성화 될 때, 자바스크립트 엔진은 해당 컨텍스트에 관련된 코드들을 실행하는 데 필요한 환경 정보들을 수집해서 실행 컨텍스트 객체에 저장한다. 이 객체는 자바스크립트 엔진이 활용할 목적으로 생성할 뿐 개발자가 코드를 통해 확인할 수는 없습니다.

 

VariableEnvironment	현재 컨텍스트 내의 식별자들에 대한 정보 + 외부 환경 정보, 선언 시점의 LE의 스냅샷으로 변경 사항은 반영되지 않음.
LexicalEnvironment	처음에는 VE와 같지만 변경 사항이 실시간으로 반영됨.
ThisBinding	this 식별자가 바라봐야 할 대상 객체

VariableEnvironment 와 LexicalEnvironment의 내부는 environmentRecord와 outer-EnvironmentReference로 구성.

초기화 과정 중에는 VariableEnvironment 와 LexicalEnvironment는 사실상 완전히 동일하고, 이 후 코드 진행에 따라 서로 달라지게 됩니다.

 

다음 포스트는 environmentRecord와 호이스팅