let, const 변수에 접근할 수 없는 시기

즉, 변수가 선언되기 전에 접근하면 오류가 발생하는 구간

발생 이유

자바스크립트에서 변수는 호이스팅 되지만, let과 const 키워드는 초기화되지 않은 상태로 존재하기 때문에 선언 전에 접근하면 오류 발생

console.log(myVar); // ❌ ReferenceError: Cannot access 'myVar' before initialization
let myVar = 10;

myVar 변수는 호이스팅되어(메모리 상에 등록) 코드 상으로는 상단에 존재하긴 하지만, 값이 할당되지는 않은 상태라서 ReferenceError가 발생하는 겁니다.

동작 방식

let 또는 const 키워드로 선언된 변수는, 실행되기 전까지 TDZ 상태에 있습니다.

// 함수 선언
function example() {
  console.log(a); // ❌ ReferenceError
  let a = 5;
  console.log(a); // ✅ 5
}

// 함수 호출
example();
  1. 평가 시점 : 자바스크립트가 코드를 실행하기 전, let a를 호이스팅
  2. console.log(a)에서 a에 접근하려고 하지만, 아직 초기화 이전 → TDZ 상태 → ReferenceError
  3. a에 5가 할당되면서 초기화됨
  4. 이후 console.log(a)는 정상적으로 출력

var와 let/const의 차이

변수 키워드 호이스팅(선언) 초기화 시점 TDZ 발생 여부
var ✅ ✅ : undefined로 초기화 ❌
let ✅ ❌ ✅
const ✅ ❌ ✅ 
// var의 경우
console.log(myVar); // ✅ undefined
var myVar = 10;
console.log(myVar); // ✅ 10

// let, const의 경우
console.log(myLet); // ❌ ReferenceError
let myLet = 10;
console.log(myLet); // ✅ 10