변수와 상수 — let·const·var

JS 에서 값을 담는 그릇은 세 가지입니다 — let·const·var. 모두 같은 일을 하는 것 같지만 스코프(범위), 호이스팅, 재할당 가능 여부에서 모두 다릅니다. 결론부터: const 가 기본, 바꿔야 하면 let, var 는 쓰지 않는다. 그 이유를 차근차근 봅니다.

한 줄 차이 — 한 표로

const — 한 번 정한 값은 안 바꾸겠다

const PI = 3.14;
PI = 3.15;        // ❌ TypeError: Assignment to constant variable.

const user = { name: "준성" };
user.name = "준석";   // ✅ 이건 OK
user = { name: "X" }; // ❌ 재할당은 안 됨

let — 바꿀 변수에만

let count = 0;
count = count + 1;   // ✅
count += 1;          // ✅ (같음)

// 반복문에서
for (let i = 0; i < 3; i++) {
  console.log(i);    // 0, 1, 2
}
console.log(i);      // ❌ i is not defined — for 블록 밖이라 못 봄

let 은 블록 스코프입니다. { } 안에서 선언하면 그 안에서만 살아 있고, 밖으로 새지 않습니다. 이게 "현대 JS" 의 정상적인 모습입니다.

var — 왜 쓰지 말아야 하나

// 1. 함수 스코프 — 블록을 무시
function demo() {
  if (true) {
    var x = 10;
  }
  console.log(x);    // 10 ← if 밖에서도 살아 있음!
}

// 2. 호이스팅이 undefined 로 끌어올림
console.log(y);      // undefined ← 에러도 안 남, 더 위험
var y = 5;

// 3. 같은 이름으로 중복 선언이 가능
var name = "준성";
var name = "준석";   // ✅ 통과 — 오타로 멀쩡한 변수를 덮어쓰기 쉬움

세 가지 모두 "의도 안 한 버그를 키우는" 방향입니다. const/let 은 이 세 가지를 모두 막아줍니다. 그래서 2015년(ES6) 이후 var 는 사실상 폐기 — 새 코드에 쓸 이유가 없습니다.

TDZ — let/const 의 "사용 금지 구역"

let·const 도 호이스팅은 됩니다. 다만 선언 줄 전까지는 "건드리면 죽음" 구역입니다. 이걸 TDZ(Temporal Dead Zone) 라고 부릅니다.

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

// vs var
console.log(b);   // undefined (에러 X)
var b = 5;

TDZ 는 처음에는 짜증나지만, 사실 "선언 전에 변수를 쓰는 것" 자체를 막아주는 안전장치입니다. 이런 코드를 컴파일 시점에 발견할 수 있게 됩니다.

네이밍 컨벤션 — 어떻게 이름 짓나

• camelCase — JS 표준. userName, totalScore, isAdmin
• UPPER_SNAKE_CASE — 절대 안 바뀌는 상수. const MAX_RETRY = 3
• PascalCase — 생성자 함수·클래스만. class User { }
• _underscore — "내부 전용" 표시 (관습일 뿐, 진짜 비공개는 #private 필드 23편)
• 피하기 — 한 글자(a, b), 숫자 시작(1user), 예약어(class, function)