이 글에서는 호이스팅에 대해 말해보려한다.
그 전에 우리가 알아야할 개념은 변수 선언은 자바스크립트 자체에서 순서를
고려하지 않고 끌어올린듯이 읽는다는 것이다.
console.log(abc);
var abc; > 변수 선언
위와 같은 예시에서 우린 변수 선언이 이후에 된 것을 알 수 있다.
이전 글에서 변수 선언을 하지 않고 식별자를 부르게 되면 참조 에러가 발생한다고
언급한 적이 있다.
저 상태에서 결과는 에러가 아닌 undefined 가 실행이 되는걸 확인할 수 있다.
그 이유는 자바스크립트 특징인 변수 호이스팅때문이다.
그렇다고 let과 const 까지도 undefined 가 출력이 되는건 아니다.
전부 호이스팅은 되지만 호이스팅의 변수 선언 초기화 과정이 다르기 떄문이다.
var 같은 경우 변수 선언과 함께 초기화가 진행된다.
따라서 초기화가 이미 이루어졌기 때문에 선언 전에도 읽을 수 있다.
console.log(color) ; // red
var color = 'red'
호이스팅 = 변수 선언문이 끌어올려져 동작한다. (+ 함수 선언문 역시 이와 같다.)
console.log(color); // ReferenceError
let color = 'red'
console.log(color); //ReferenceError
const color = 'red'
반면 let 과 const 에서 선언 후 초기화 전까지
Temporal Dead Zone 이라는 곳에 변수가 놓이게 된다.
이 곳에선 호이스팅에 되더라도 변수를 읽을 수 없게 되어
ReferenceError(참조 에러) 가 발생하게 되는 것이다.
와!