[JavaScript] 변수 선언문 완벽 정리: var, let, const 차이점과 주의점

JavaScript에서 변수를 선언하는 방법은 var, let, const 세 가지가 있습니다. 각각의 선언문이 어떻게 작동하는지 이해하고, 올바르게 사용하는 것이 중요합니다. 이번 글에서는 각 선언문의 차이점과 사용법을 예제와 함께 정리해보겠습니다.

1. const vs let 차이점

const: 상수(Constant) 선언

const로 선언한 변수는 재할당이 불가능합니다. 선언 시 반드시 값을 할당해야 하며, 이후 값을 변경할 수 없습니다.

const PI = 3.14;
PI = 3.14159; // ❌ 오류 발생: Assignment to constant variable.

 

하지만 객체나 배열의 속성은 변경이 가능합니다.

const user = { name: "Alice", age: 25 };
user.age = 26; // ✅ 가능
console.log(user); // { name: "Alice", age: 26 }

user = { name: "Bob", age: 30 }; // ❌ 오류 발생 (새로운 객체 할당 불가)

 

let: 재할당 가능하지만, 재선언 불가

let으로 선언한 변수는 값의 재할당이 가능합니다.

let age = 30;
age = 31; // ✅ 가능
console.log(age); // 31

 

하지만 같은 변수명을 중복 선언할 수 없습니다.

let name = "Alice";
let name = "Bob"; // ❌ 오류 발생: Identifier 'name' has already been declared

 

2. var vs let vs const 비교

키워드	재할당	재선언	블록 스코프	호이스팅
var	✅ 가능	✅ 가능	❌ 없음	✅ 호이스팅되지만 undefined
let	✅ 가능	❌ 불가능	✅ 있음	✅ 호이스팅되지만 사용 불가 (TDZ)
const	❌ 불가능	❌ 불가능	✅ 있음	✅ 호이스팅되지만 사용 불가 (TDZ)

 

var의 특징과 문제점

과거에는 var만 존재했지만 몇 가지 단점이 있어 최근에는 잘 사용하지 않습니다.

1) var는 블록 스코프를 가지지 않는다.

if (true) {
    var message = "Hello";
}
console.log(message); // "Hello" (블록 밖에서도 접근 가능)

 

반면, let과 const는 블록 스코프를 가집니다.

if (true) {
    let msg = "Hello";
}
console.log(msg); // ❌ 오류 발생 (msg is not defined)

 

2) var는 호이스팅(Hoisting) 시 undefined가 할당된다.

console.log(value); // undefined (에러는 아님)
var value = 10;

 

위 코드에서 var value는 선언만 먼저 되고 초기화는 뒤늦게 이루어집니다. 하지만 let과 const는 TDZ(Temporal Dead Zone)로 인해 선언 전에 접근하면 오류가 발생합니다.

console.log(num); // ❌ ReferenceError 발생
let num = 10;

 

3. 주의해야 할 점

1) const는 불변이 아님!

앞서 언급했듯이, const는 재할당이 불가능하지만, 객체의 속성은 변경할 수 있습니다. 따라서 완전한 불변성을 원한다면 Object.freeze()를 활용해야 합니다.

const user = { name: "Alice", age: 25 };
Object.freeze(user);

user.age = 26; // 변경 시도
console.log(user.age); // 25 (변경되지 않음)

 

2) let과 const는 TDZ(Temporal Dead Zone)를 주의하라

console.log(myVar); // undefined
var myVar = 5;

console.log(myLet); // ❌ ReferenceError
let myLet = 10;

 

TDZ 때문에 let과 const는 선언 전에 접근할 수 없습니다.

---

✅ const를 기본적으로 사용: 변경되지 않는 값을 선언할 때
✅ let은 값이 변경될 경우 사용: 반복문, 값이 변하는 변수
🚫 var는 사용 지양: 블록 스코프 문제와 호이스팅 문제 발생