실행 컨텍스트
실행 컨텍스트란? 자바스크립트 코드가 실행되는 환경을 제공하는 객체이다.
실행 컨텍스트는 코드가 실행되었을 때 자바스크립트 엔진 내부의 콜스택에서 전역컨텍스트를 시작으로 함수가 실행되는 기준으로 실행 컨텍스트가 생성되고, 제일 내부에서 실행된 함수가 콜스택에서 제일 먼저 바라보게 된다.
실행 컨텍스트에서 코드가 실행되는 조건이나 속성 등은 매우 많지만, 그 중 가장 대표적인 기능은 record, outer가 있다.
record(환경 레코드)의 경우, 실행 컨텍스트에서 코드가 실행될 때 실행단계 전 생성단계에서 코드를 먼저 한번 읽는다.
그러면서 선언된 변수, 함수를 미리 메모리에 저장해놓는 일을 하는데, 이것을 record가 한다.
record(환경 레코드): 식별자와 식별자에 바인딩된 값을 기록해두는 객체
그리고 outer의 경우, 현재 콜스택에서 보고있는 함수에서 특정 변수에 접근할때, 해당 변수가 현재 실행중인 함수에 없는 경우, outer를 통해서 실행중인 함수 바깥 스코프에 있는 함수에서 해당 변수를 찾을 수 있다. 그렇게 죽죽 바깥 스코프로 올라가서 전역 컨텍스트까지 변수를 찾을 수 있는데, 이것을 outer를 활용해서 한다.
이런 작업을 스코프 체이닝이라고도 한다!
outer(외부 환경 참조, outer Environment Reference): 바깥 Lexical Environment를 가리킴
변수 & 함수 호이스팅
자바스크립트 엔진에서 코드가 실행되기전에, 한번 코드를 주욱 읽어서 변수나 함수를 먼저 생성하는 단계를 걸치게 된다.
그 생성단계를 거치면서 변수, 함수 선언을 먼저 진행하게 된다.
그리고 나서 코드 실행이 시작되면 생성단계에서 이미 선언된 변수, 함수가 실행단계의 코드상에서 선언, 할당이 이루어지기 전에 참조가 된다면
var로 선언, 할당한 변수의 경우 먼저 생성단계에서 선언, 초기화된 undefined라는 결과를 받게 되고, 함수의 경우 선언 전에도 실행을 할 수 있게 된다.
이와 같은 경우를 마치 변수함수가 코드 맨위로 끌어올려진다고 해서 호이스팅이라고 한다.
let, const
let, const의 경우, var의 단점을 커버하려는 목적으로 ES5 이후에 생성된 예약어인데,
let, const는 자바스크립트 엔진에서 코드를 주욱 먼저 읽는 생성단계에서 변수 호이스팅은 일어나지만, 초기화는 일어나지 않는다.
그래서 let, const로 변수 선언, 할당을 했을 때 해당 변수를 그 전에 참조하게되면, 아직 값이 초기화되지않았기 때문에 Reference 에러가 난다.
그래서 할당전까지 해당 변수를 참조할 때 Reference 에러가 나는 구역을 TDZ, 일시적 사각지대라고 한다.
var에 함수를 할당했을 때
var로 함수를 할당할 수 있다. 그렇다면 위에서 설명했듯이 생성단계를 걸치면서 var로 선언된 변수가 undefined로 먼저 초기화가 된다.
그리고 함수를 할당하는 구간까지는 undefined, 이후에 함수를 실행할 수 있게 되는데, (var에 함수가 할당되는 부분 전에 함수가 호출되면 undefined를 호출한 셈이 되므로 TypeError가 발생한다.) 이렇게 변수에 함수를 할당해놓는 것을 함수 표현식이라고 한다.
그리고 함수를 변수로 담을 필요없이 바로 선언할 수도 있는데, 이를 함수 선언문이라고 한다. 함수를 바로 선언하게 되면 생성단계에서 함 함수 호이스팅으로 인해 함수가 처음부터 모든 내용이 입력된다.
그래서 함수를 아래에 선언했는데도 해당 코드 위에서도 함수를 실행할 수 있게 된다.