[JAVA SCRIPT] var, let, const의 차이점 : 모던 자바스크립트의 변수 설계 철학

var, let, const

 

자바스크립트 학습자가 가장 먼저 마주하는 벽이자, 숙련된 개발자조차 가끔 실수하는 영역이 바로 변수 선언(Variable Declaration)입니다. 과거에는 var 하나로 충분했지만, 웹 애플리케이션의 규모가 방대해지면서 자바스크립트는 더욱 엄격하고 안전한 변수 관리 체계를 도입했습니다. 오늘 우리는 ES6(2015) 이후 표준이 된 let과 const, 그리고 역사 속으로 사라지고 있는 var의 본질적인 차이를 심층 분석합니다.

1. 왜 'var'는 은퇴의 길을 걷게 되었는가?

초기 자바스크립트의 var는 유연함이 장점이었으나, 이는 곧 '예측 불가능성'이라는 독이 되었습니다. 가장 큰 문제는 함수 레벨 스코프(Function-level scope)와 호이스팅(Hoisting) 현상이었습니다. 변수를 선언하기 전에도 참조가 가능하거나, 의도치 않게 전역 변수가 오염되는 문제는 대규모 프로젝트에서 치명적인 버그를 양산했습니다.

2. var, let, const 완벽 비교 분석

세 키워드의 차이를 명확하게 이해하기 위해 스코프, 재할당 가능 여부, 호이스팅 동작 방식을 기준으로 정리했습니다.

구분 항목	var	let	const
유효 범위 (Scope)	함수 레벨 스코프	블록 레벨 스코프 ({ })	블록 레벨 스코프 ({ })
재선언 가능성	가능 (에러 없음)	불가능 (Syntax Error)	불가능 (Syntax Error)
재할당 가능성	가능	가능	불가능 (상수)
호이스팅 특징	선언과 초기화가 동시에 발생 (undefined 반환)	TDZ(일시적 사각지대) 존재 (Reference Error)	TDZ 존재 (Reference Error)

3. 실전 예제: 호이스팅과 스코프의 실체

아래의 Sample Example을 통해 실제 코드에서 어떤 차이가 발생하는지 확인해 보세요.

// 1. var의 위험성: 호이스팅
console.log(name); // 결과: undefined (에러가 나지 않음!)
var name = "Gemini";

// 2. let과 const의 안전성
// console.log(age); // Uncaught ReferenceError 발생 (TDZ 때문)
let age = 25;
const PI = 3.14159;

// 3. 블록 스코프 테스트
if (true) {
    var globalVar = "I am everywhere";
    let blockVar = "I am hidden";
}
console.log(globalVar); // 출력 가능
// console.log(blockVar); // ReferenceError: blockVar is not defined

// 4. const 주의점: 객체 내부 변경
const user = { name: "Kim" };
user.name = "Lee"; // 가능 (참조 값 자체가 바뀌는 것이 아니기 때문)
// user = { name: "Park" }; // TypeError: Assignment to constant variable.

4. 2026년 기준 변수 선택 가이드라인

현업 개발자로서 권장하는 변수 선언 전략은 "Default Const" 방식입니다.

• 기본값으로 const를 사용하세요: 값이 변하지 않는다는 것을 보장하면 코드의 가독성이 올라가고 사이드 이펙트가 줄어듭니다.
• 재할당이 필요한 경우에만 let을 사용하세요: 반복문(for문)이나 조건에 따라 값을 갱신해야 할 때가 이에 해당합니다.
• var는 사용하지 마세요: 레거시 코드를 유지보수하는 상황이 아니라면, 현대 자바스크립트에서 var의 역할은 없습니다.

5. 결론: 더 나은 코더가 되기 위한 선택

let과 const를 정확히 구분하여 사용하는 것은 단순히 문법을 지키는 행위가 아닙니다. 이는 동료 개발자에게 이 데이터가 어떤 의도를 가지고 있는지 명확히 전달하는 커뮤니케이션의 시작입니다. 올바른 변수 선택으로 런타임 에러를 사전에 방지하고, 유지보수가 쉬운 견고한 코드를 작성해 보시기 바랍니다.

---

내용 출처 및 데이터 근거

• ECMA International - ECMAScript® 2024 Language Specification
• Mozilla Developer Network (MDN) - "Grammar and types: Declarations"
• Google JavaScript Style Guide - Section 5.1.1 (Using const and let)