[자바스크립트] 실행 컨텍스트

실행 컨텍스트 

자바스크립트의 동적 언어로서 성격을 가장 잘 파악할 수 있는 개념, 실행할 코드에 대한 정보들을 모아놓은 객체 

동일 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아서 객체 구성 > 콜스택 쌓기 > 관련 코드 실행

전체 코드의 환경과 순서를 보장함

 

함수 실행 시, 처음 자바스크립트 코드를 실행하는 순간 전역 컨텍스트가 콜 스택에 담김 

전역 컨텍스트는 코드 내부에서 별도의 실행 명령이 없어도 브라우저에서 자동으로 실행 

// 전역 컨텍스트와 관련된 코드들을 실행하다가 outer 함수를 호출하면 
// outer에 대한 환경 정보를 수집해 outer 함수를 호출하면 엔진은 outer에 대한 환경 정보를 수집해서 
// outer 실행 컨텍스트를 생성한 후 콜 스택에 담는다. > 전역 컨텍스트와 관련된 코드 중단 
// outer 실행 컨텍스트와 관련된 코드들을 순차실행 

let a = 1;
function outer() {
	function inner() }
    console.log(a); // undefined
    let a =3; 
    }
    
    inner();
    console.log(a); //1 
 }
 outer(); 
 console.log(a); // 1

 

 

하나의 실행 컨텍스트가 콜 스택의 맨 위에 쌓이는 순간, 현재 실행할 코드에 관여하게 됨 

실행 컨텍스트가 활성화 될 때, 자바스크립트 엔진은 관련 코드를 실행하는데 필요한 환경 정보들을 수집해 실행 컨텍스트 객체에 저장함( VairableEnviroment, LaxicalEncironment / ThisBinding 정보가 저장됨) 

 

 * vairableEnviroment 컨택스트 내의 식별자 정보 + 외부 정보, 선언 시점의 LexicalEnviroment의 스냅샷

   variableEnviroment 에 정보를 먼저 담고, 이를 그대로 복사해 렉시컬 환경을 만들고 이후에는 렉시컬 환경을 주로 사용

 * Lexical Enviroment 의 내부는  environmentRecord 와 outer-EnviromentReference로 구성 

 

  1) enviromentRecord : 현재 컨텍스트 관련 코드의 식별자 정보가 저장(매개변수 이름, 함수 선언, 변수명..)

      식별자에 어떤 값이 할당될 것인지는 신경쓰지 않음, 변수명만 위로 끌어올려 실행되고 할당 과정은 원 자리에 그대로

  2) 변수 x를 선언함, 메모리에서 저장 공간을 확보하고 확보한 공간의 주소값은 변수 x 에 연결함 

      다시 변수 x를 선언, 이미 선언된 변수 x 가 있으므로 무시함 

 

function a(x){
	console.log(x); //1 
    var x;
    console.log(x); // undefined
    var x = 2; 
    console.log(x); // 2
}

a(1);

// 호이스팅을 통한 실제 출력 
// environmentRecord따라 수집 대상을 호이스팅하고 난 후 
function a(x){
    var x; // 변수 x 선언, 저장공간을 확보하고 주소값을 변수 x에 연결
    var x; // 다시 변수 x를 선언
    var x;
    
    x = 1; //x에 1을 할당
    console.log(x); // 1
    console.log(x); // 1
    x = 2; // x에 2를 할당 
    console.log(x); // 2
}

a(1); // a함수를 실행하는 순간 함수의 실행 컨텍스트가 생성됨