📝 JavaScript 변수 - var, let, const 정리

1. var

• ES5까지 사용된 변수 선언 방법
• 중복 선언 가능
• 호이스팅 발생 (선언만 위로 끌어올려짐, 초기화는 안 됨)
• 함수 스코프를 가진다. ({} 중괄호를 무시하고 함수 단위로 스코프를 가짐)

📌 예시

console.log(a); // undefined (호이스팅)
var a = 5;
console.log(a); // 5

function test() {
  if (true) {
    var x = 10;
  }
  console.log(x); // 10 (if문 블록 무시하고 접근 가능)
}
test();								

2. let

• ES6(2015)부터 등장

• 중복 선언 불가

• 호이스팅은 발생하지만 초기화 전에 접근하면 에러 (Temporal Dead Zone)

• 블록 스코프를 가진다. ({} 안에서만 유효)

📌 예시

let b = 10;
b = 20; // 값 변경 가능

function testLet() {
  if (true) {
    let y = 30;
    console.log(y); // 30
  }
  console.log(y); // ReferenceError (블록 스코프)
}
testLet();

3. const

• ES6부터 등장

• 값 재할당 불가 (초기화 이후 값 변경 금지)

• 호이스팅은 발생하지만 접근 시 에러

• 블록 스코프를 가진다.

📌 예시

const c = 100;
c = 200; // TypeError: Assignment to constant variable.

const arr = [1, 2, 3];
arr.push(4); // 가능 (참조 주소는 그대로, 내부 데이터 변경)

const obj = { name: 'John' };
obj.name = 'Jane'; // 가능

📚 var, let, const 비교표

특징	var	let	const
선언 시점	끌어올림(hoisting)	끌어올림, TDZ 발생	끌어올림, TDZ 발생
스코프	함수 스코프	블록 스코프	블록 스코프
재선언	가능	불가	불가
재할당	가능	가능	불가 (단, 객체/배열 내부 변경은 가능)

✏️ 정리

• var는 이제 사용 지양!

• 변할 수 있는 값이면 let

• 변하지 않는 값이면 const를 사용하는 것이 기본.