02 실행 컨텍스트

2-1 실행 컨텍스트란?

• 실행 컨텍스트 : 실행할 코드에 제공할 환경 정보들을 모아놓은 객체
• 스택 : 우물같은 구조
• 큐 : 파이프같은 구조

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

• 자바스크립트 파일이 열리는 순간 전역 컨텍스트가 활성화된다.

2-2 VariableEnvironment

• 최초 실행 시의 스냅샷을 유지한다.
• 실행 컨텍스트를 생성할 때 VariableEnvironment를 먼저 담은 다음 이를 그대로 복사해서 LexicalEnvironment를 만들고, 이후에는 LexicalEnvironment를 주로 활용
• 내부는 environmentRecord와 outerEnvironmentReference로 구성

2-3 LexicalEnvironment6

• ‘어휘적 환경’, ‘정적 환경’ → X
• “현재 컨텍스트의 내부에는 a, b, c와 같은 식별자들이 있고 그 외부 정보는 D를 참조하도록 구성돼 있다”

2-3-1 environmentRecord와 호이스팅

• environmentRecord : 현재 컨텍스트와 관련된 코드의 식별자 정보들이 순서대로 저장됨
• 호이스팅
  

    function a () {
    	console.log(b); // b함수
    	var b = 'bbb';
    	console.log(b); // 'bbb'
    	function b () { }
    	console.log(b); // 'bbb'
    }
    a();

• 함수 선언문
  • 전체를 호이스팅

    function a () { 
    	// 함수 선언문. 함수명 a가 곧 변수명
    } 
    a(); // 실행

• 함수 표현식
  • 선언부만 호이스팅

    var b = function () {
    	// 익명 함수 표현식. 변수명 b가 곧 함수명
    }
    b(); // 실행

    var c = function d () {
    	// 기명 함수 표현식. 변수명은 c, 함수명은 d
    }
    c(); // 실행
    d(); // 에러

2-3-2 스코프, 스코프 체인, outerEnvironmentReference

• 스코프 : 식별자에 대한 유효범위
• ES5까지의 JS : 함수에 의해서만 스코프가 생성
• 스코프 체인 : 식별자의 유효범위를 안에서부터 바깥으로 차례로 검색해나가는 것
• outerEnvironmentReference : 현재 호출된 함수가 선언될 당시의 LexicalEnvironment를 참조함

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

• 변수 은닉화 : inner 함수 내부에서 a 변수를 선언했기 때문에 전역 공간에서 선언한 동일한 이름의 a 변수에는 접근할수 없다.
• 전역변수 사용을 최소화하는 것이 좋다.
  • 즉시실행함수 활용, 네임스페이스, 모듈 패턴, 샌드박스 패턴 등

2-4 this

• 실행 컨텍스트의 thisBinding에는 this로 지정된 객체가 저장된다.
• 실행 컨텍스트 활성화 당시에 this가 지정되지 않은 경우 this에는 전역 객체가 저장된다.