아래 표는 let, const, var의 주요 차이점을 요약한 내용입니다:
| 특징 | let | const | var |
|---|---|---|---|
| 범위 | 블록 범위 (block scope) | 블록 범위 (block scope) | 함수 범위 (function scope) |
| 재할당 가능 | 가능 | 불가능 | 가능 |
| 초기화 필요 | 선택 사항 | 필수 | 선택 사항 |
| 전역 객체 | 아님 | 아님 | 예, 전역 객체의 프로퍼티로 존재 |
| 호이스팅 | 발생 | 발생 | 발생 |
여기서 중요하게 살펴볼 점은 블록범위, 호이스팅인데요! 블록범위에 대해서는 링크에 제가 자세히 정리해보았습니다. 이번에느 호이스팅에 대해 자세히 살펴봅시다!
호이스팅
세 키워드 모두 호이스팅이 발생합니다!
var 호이스팅 : undefined
var로 선언된 변수는 호이스팅되면서 undefined로 초기화됩니다. 호이스팅으로 인해 변수 선언부가 스코프의 맨 위로 이동하며, 이후 실제 코드가 실행되기 전에 변수가 undefined로 초기화됩니다.
console.log(x); // undefined
var x = 10;let/const 호이스팅 : TDZ
let과 const로 선언된 변수는 호이스팅되지만, 초기화되기 전까지 "존재하지 않는" 상태로 호이스팅됩니다. 이를 일시적 사각지대(Temporal Dead Zone, TDZ)라고도 합니다.
TDZ는 변수가 선언된 위치부터 초기화되기 전까지의 구간을 의미합니다. TDZ에서는 변수에 접근하려고 하면 ReferenceError가 발생합니다.
console.log(x); // ReferenceError: x is not defined
let x = 10;따라서 let과 const 변수도 호이스팅되지만, TDZ에 놓이기 때문에 초기화되기 전에 변수에 접근하는 것은 불가능합니다. 이는 변수의 일시적인 유효 범위를 제공하여 코드의 안정성을 높이는 역할을 합니다.
