[Javascript] 실행 컨텍스트
Javascript 언어의 가장 중요한 개념 중 실행 컨텍스트를 다뤄보겠습니다.
1. 실행 컨텍스트란?
실행할 코드에 제공할 환경 정보들을 모아놓은 객체를 뜻합니다. 각 환경에 있는 정보를 모아놓은 실행 컨텍스트가 콜스택에 쌓여 실행이 되기 때문에 실행되는 코드의 환경정보와 순서를 보장할 수 있게 합니다. 실행 컨텍스트가 활성화 될 때 호이스팅, 환경정보 구성, this 값이 설정됩니다.
2. 실행 컨텍스트의 구성
1) 변수객체 (variable environment)
현재 컨텍스트 내부에서 사용하는 식별자(변수) 들의 대한 정보가 생성되며, 외부 환경 정보 및 선언 시점의 렉시컬 환경(Lexical Environment)의 스냅샷 정보를 담습니다. 렉시컬 환경이란 변수객체에 호이스팅된 변수 및 함수들의 정보들의 초기 값을 전달하고 이후에는 변수객체의 실시간 변경사항을 업데이트 하여 관리하여 최신화 합니다. 또한 렉시컬환경은 식별자들의 초기 정보를 기억하고 있습니다.
변수객체는 변수와 메개변수 및 인수정보, 함수선언의 정보를 가지는 객체를 가리키는데 이때 Global Context의 객체를 전역객체/GO(Global Object)라고 하고 함수 컨텍스트의 객체를 활성객체/AO(Activation Object)라고 합니다.
console.log(test) // undefined
//test는 코드 실행전에 식별자가 정의 되었기 때문에 reference error는 발생하지 않음
let test = 'test'
let test2 = 'test2'
console.log(test2) // 'test2'
2) 스코프 체인(Scope Chain)
스코프는 식별자의 탐색 유효범위를 뜻합니다. 자신의 활성객체를 포함하여 상위 컨텍스트 -> 상위 컨텍스트.. -> global Object순서로 연결됩니다. 자신의 활성객체부터 가장 마지막 global까지 탐색 범위를 가지는 것을 Scope Chain이라고 합니다.
3) this 바인딩
각 식별자들이 바라봐야 할 this정보를 가지고 있습니다. 함수 호출 패턴에 의하여 결정됩니다.
호이스팅이란?
코드 실행 시 변수객체가 생성될 때 선언된 변수와 함수를 가장 위로 끌어 올리는 것을 호이스팅 이라고 합니다. 함수의 경우 선언식과 표현식에 따라 동작이 달라지게 됩니다.
///// 코드 실행전
foo();
bar();
console.log(x);
var foo = function() {
console.log("foo");
};
function bar() {
console.log("bar");
}
var x = 1;
///// 호이스팅 발생 시
var foo; // 변수값 선언
var x; // 변수값 선언
function bar (){ //함수선언
console.log("bar");
}
//foo(); // Uncaught TypeError: foo is not a function
console.log(foo) // undefined
bar(); // 'bar'
console.log(x); // undefined
foo = function() {
console.log("foo");
}
x = 1;
참고사이트