[Javascript] - 실행컨텍스트
in Web on Javascript
여러 영상들을 통해 자바스크립트의 실행컨텍스트를 정리해보고자 한다.
실행 컨텍스트의 구성
여기서 EnvironmentRecord와 Outer Enviroment Reference를 살펴보자.
콜스택과 실행컨텍스트
자바 스크립트 엔진은 콜스택이라는 곳에서 함수의 실행컨텍스를 담아서 관리한다.
stack이라는 이름처럼 실제 stack자료 구조로 실행된다.
최초에는 Global, 전역 실행컨텍스트가 담기고 함수가 실행되면 함수의 실행컨텍스트가 담기게 된다.
stack 답게 가장 마지막에 넣은 함수의 실행컨텍스트가 활성화 된다고 보면 된다.
함수가 종료되면 실행콘텍스트는 pop되고 한칸씩 줄어들어간다.
모든 내용이 실행되고 다면 전역 실행컨텍스트도 콜스택에서 사라지게된다.
호이스팅
위 처럼 선언문 전에 접근할때 undefined로 출력되는 현상을 호이스팅이라고 한다.
자바스크립트 엔진이 먼저 전체 코드를 스캔하면서 변수를 미리 선언해놓는다.
그때 기록되는 공간이 환경 레코드이다.
정식명칭은 Environment Record로 식별자와 식별자에 바인딩 된 값을 기록한다.
var 변수 호이스팅
자바스크립트 엔진은 생성 단계에서 선언문만 먼저 실행해서
TVChannel의 변수를 undefined로 생성해놓는다.
그리고 실행단계를 통해 변수의 값을 변화시키고 함수를 실행하는 등의 동작이 실행된다.
그래서 TVChannel은 생성단계 이후 undefined로 이미 생성되있기 때문에 console.log(TVChannel);이 에러가 아니라 undefined가 뜨게 된다.
const, let 변수 호이스팅
const와 let은 똑같이 생성단계에 환경레코드에 식별자를 등록하는 과정을 거친다.
하지만 var와 다른점은 var는 undfined로값을 초기값을 넣어준것과 다르게 초기값을 넣지 않는다.
var는 선언과 초기화가 동시에 이뤄진다. const, let은 선언만 실행한다. 초기화가 되어있지 않아 접근이 되지않는다.
그렇기에 접근하면 Reference Error가 발생한다.
이미 생성되었지만 접근하지 못하는 이 구간을 일시적 사각지대라고 부른다.
함수 호이스팅
변수에 함수를 담아서 사용하는 것을 함수 표현식이라고 한다.
함수 표현식은 결국 변수이기 때문에 상단에서 접근할때 var로 선언하면 undefined라서 Type Error가 발생하고, const,let은 접근이 안돼서 Reference Error가 발생한다.
var ⇒ undfined ⇒ Type Error const, let ⇒ Reference Error
function 키워드로 생성하는 것은 함수 선언문이라고 한다.
함수 선언문은 선언과 동시에 함수 생성을 하게 된다.
외부 환경 참조
실행 컨텍스트에 있는 내용으로 바깥 Lexical Environment를 가르킨다.
즉 나의 상위 실행 컨텍스트로 이동할 수 있다.
식별자 결정
위와 같이 lamp라는 변수가 함수 바깥에도 내부에도 선언된 경우 어떤 변수를 선택할 것인가의 문제를
식별자 결정이라고 한다. 이 과정에서 outer 가 사용된다.
기본적으로 자바스크립트 엔진은 현재 활성화된 실행 컨텍스트를 기준으로 식별자를 확인하며
만약 식별자가 현재 실행 컨텍스트에 없다면 outer를 통해 이전 실행컨텍스트를 찾아가서 식별자를 결정한다.
그러다보니 동일한 식별자가 선언될 경우 상위 식별자가 가려지게 되는데 이것을 변수 섀도잉이라고 한다.
이렇게 식별자를 찾을때 사용하는 스코프들의 연결을 스코프 체인이라고 하고
찾는 과정을 스코프 체이닝이라고 한다.
결론
쉽게 말해 코드 실행을 위한 환경을 관리해주는게 실행 컨텍스트이다.
식별자 결정을 더욱 효율적으로 하기위한 수단이다.
실행 컨텍스트도 처음부터 완성된것이 아니라 점차적으로 발전해 왔었다.
ES3에는 어디서 실행되느냐에 따라서 동적으로 스코프를 관리했지만
ES5이후부터는 선언된 위치를 기준으로 정적으로 스코프를 관리한다.
