Hoisting / TDZ
· 약 2분
TIL : Today I Learned
호이스팅과 TDZ에 대해서 설명합니다. 해당 포스팅에서는 변수에 집중하여 설명합니다.
Hoisting / TDZ
호이스팅이란?
var, let, const, function, class 키워드를 사용해서 선언하는 모든 식별자는 호이스팅된다. 왜냐하면 선언문은 실행하기 (런타임) 이전에 먼저 소스 코드의 평가 과정 (컴파일) 을 거치면서 실행하기 위한 준비를 하기 때문이다.
때문에 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 호이스팅이라고 한다.
TDZ란?
Temporal Dead Zone의 약자로 변수가 let, const 키워드로 선언되었지만 아직 초기화되지 않은 경우 발생하는 동작이며, 이 시간 동안 변수에 접근하면 ReferenceError가 발생한다. 이는 변수가 범위 내에 존재하지만 값이 할당될 때까지 접근할 수 없는 'Dead Zone'에 있기 때문이다.
TDZ는 변수가 초기화될 때 종료되며 그 후에 접근할 수 있고, 잠재적인 버그를 피하기 위해 TDZ를 인식하는 것이 좋다.
var는 선언과 초기화가 동시에 진행되지만let은 선언과 초기화가 따로 진행된다. 호이스팅된 후 실제 코드에 도달할 때 초기화된다. (보통 이 기간을 TDZ라고 함)const는 선언, 할당, 초기화 셋이 동시에 진행된다.
WHY?
var는 선언과 초기화가 분리되어 있는 문제로 전역에도 같은 변수명에 선언과 할당이 가능한 문제가 발생했다.
그래서 let과 const 키워드가 탄생했고, let은 변할 수 있기 때문에 선언과 초기화가 분리되어 TDZ 개념 도입, const는 변하면 안 되는 상수 개념으로 선언과 초기화를 동시에 진행하여 재할당을 방지한다.
한 줄 요약
- 호이스팅이란 컴파일 과정에서 코드가 위로 끌어올려진 것처럼 동작하는 자바스크립트의 고유 특징이다.
- TDZ는 선언된 변수를 호이스팅해 코드를 만나기 전까지의 영역을 말하며, 이때 변수에 접근하면 참조 에러가 발생한다. 코드를 만나(초기화) TDZ가 종료된다.