호이스팅과 TDZ

호이스팅이라는 개념을 알기 위해서는 자바스크립트에서의 변수 선언에 대해서 알 필요가 있다.

const a = 1
이라는 코드를 쳤다고 했을 때, 이는 선언과 초기화, 할당을 동시에 진행한 것이다.
선언  : const a
초기화 / 할당: a = 1 

왜 이 개념을 먼저 알아야 하냐면 호이스팅이란 자바스크립트 인터프리터가 동작할 때에 선언된 것들을 싹다 끌어올리는 것을 이야기 한다.

중요한 점은 각각이 선언하는 방식에 따라 호이스팅 된 결과가 다르다는 점이다.
var로 선언된 변수와 const, let으로 선언된 변수는 각각 다르게 동작하는데 var의 경우에는 호이스팅되어질 때에 undefined로 값을 초기화하기 때문에 값을 할당하는 코드라인 이전에는 undefined가 출력된다.
const와 let은 ES6 이후 등장한 문법으로 호이스팅되더라도 할당 이전에 호출하게 되면 reference 에러를 가져온다.
이유는 초기화 단계를 별도로 진행하지 않고 호이스팅되어 선언만 되기 때문이다. 이렇듯 호이스팅 되어지고 초기화 되어지는 그 사이에서 reference 에러가 나는 구간을 일시적 사각지대, TDZ라고 한다.

 

var를 사용하면 안되는 이유?

1. 전역변수 선언시 window 전역 객체의 속성으로 등록되어짐.

2. 함수 스코프를 가짐으로 인해서 블록 스코프 안에서 선언되더라도 밖에서 참조가 가능함.

3. 중복선언이 가능함.