호이스팅과 TDZ

호이스팅, TDZ 이슈...?

호이스팅 은 선언 끌어올리기를 말한다. var 변수를 먼저 불러오고, 선언을 아래쪽에서 해줘도 변수를 사용할 수 있는 이유이다. 자바스크립트의 변수는 선언된 후, '초기화 단계'에서 메모리에 공간을 확보해서 재사용이 가능하게 한다.
그런데 var는 선언과 초기화가 함께 되지만, let과 const는 선언과 초기화가 분리될 수 있다. 즉, let, const 변수를 먼저 불러오고, 선언을 아래쪽에서 해준다면 선언만 호이스팅되어 위로 올라가고 초기화는 아래쪽에 그대로 남아있게 된다.
때문에 아래와 같은 예시에서 ReferenceError가 난다. 이때 선언은 되었지만 초기화되지 않은 상태를 TDZ(temporal dead zone) 이라고 부른다.

function cat () {
  name = 'perl'; // 초기화 없이 
  console.log(name);
  let name; // 
}

• TDZ