JavaScript var와 let의 차이점: 스코프부터 재선언까지 한눈에 정리

JavaScript에서 변수를 선언할 때는 var와 let, 두 가지 키워드를 사용할 수 있습니다. 그렇다면 언제 var를 쓰고, 언제 let을 사용해야 할까요? 두 키워드의 주요 차이점을 정확히 이해하는 것이 올바른 선택의 첫걸음입니다.

가장 큰 차이: 스코프(Scope)

let과 var의 핵심적인 차이는 바로 스코프(scope)입니다. let으로 선언된 변수는 자신이 선언된 블록({}) 안에서만 유효한 블록 스코프(block scope)를 가집니다. 반면 var로 선언된 변수는 블록과 무관하게 어디서든 접근할 수 있는 전역 스코프(global scope)를 갖습니다.

즉, var는 블록 스코프를 무시하고 변수를 전역적으로 정의하는 키워드라고 볼 수 있습니다.

window 객체 등록 여부

let의 스코프가 선언된 블록에 국한된다는 점 외에도 눈여겨볼 특징이 있습니다. let으로 선언한 변수는 블록 밖, 즉 전역에서 선언하더라도 전역 window 객체에 등록되지 않습니다. 반면 var로 전역 선언된 변수는 window 객체를 통해 얼마든지 접근할 수 있습니다.

어떤 상황에서 무엇을 쓸까?

스코프가 제한적이라는 특성 때문에 let은 for 루프, while 루프, if 조건문 내부처럼 변수의 사용 범위가 짧고 명확한 경우에 주로 활용됩니다. 반면 var는 값이 자주 바뀌지 않으면서 여러 위치에서 전역적으로 접근해야 하는 변수에 적합합니다.

재선언(Redeclaration) 가능 여부

또 하나의 중요한 차이점은 재선언입니다. var로 선언된 변수는 같은 스코프 안에서 몇 번이든 다른 값으로 재선언할 수 있지만, let으로 선언된 변수를 다시 선언하면 SyntaxError가 발생합니다.

예제 코드로 확인하기

먼저 window 객체 등록 여부를 비교해 보겠습니다.

let a = 'hello'; // 전역처럼 보이지만 window에는 등록되지 않음
var b = 'world'; // 진짜 전역 스코프

console.log(window.a); // undefined
console.log(window.b); // 'world'

다음은 재선언 가능 여부를 비교한 예제입니다.

// var는 재선언 가능
var x = 'hello';
var x = 'world'; // 문제없음, 'hello'가 'world'로 대체됨

// let은 재선언 불가
let y = 'hello';
let y = 'world'; // SyntaxError: Identifier 'y' has already been declared

정리하자면, 현대 JavaScript 개발에서는 예기치 않은 스코프 오류와 전역 오염을 방지하기 위해 기본적으로 let(또는 상수라면 const)를 사용하고, var는 레거시 코드 호환성이 필요한 경우에만 사용하는 것이 권장됩니다.