JavaScript - var VS let VS const

var let const 기본 개념

자바스크립트 초창기에는 변수를 만들 때 var밖에 없었어요. 그래서 함수 스코프만 이해하면 대부분 해결됐죠. 그런데 ES6 이후 let과 const가 등장하면서 상황이 완전히 달라졌습니다.

let은 블록 스코프를, const는 블록 스코프에 더해 재할당까지 막아주는 역할을 해요. 실제로 2016년 이후 크롬에서 let과 const가 안정적으로 동작하기 시작하면서 많은 개발자들이 var 대신 이 둘을 쓰기 시작했어요.

예를 들어 가격과 부가가치세율을 변수로 만든다고 생각해 보세요. 가격은 언제든 바뀔 수 있으니 let price = 1000;으로 선언하고, 부가가치세율 0.1은 절대 바뀌면 안 되니까 const vat = 0.1;으로 선언하는 거예요. 이렇게 구분해서 쓰면 실수로 값을 바꾸는 일을 원천 차단할 수 있어요.

스코프 차이점 직접 디버깅으로 확인하기

개발자 도구에서 실제로 한 줄씩 실행해 보면 차이가 바로 눈에 들어와요. var로 선언한 변수는 함수 안에서 선언해도 글로벌 스코프에 등록되는 경우가 많아요. 반면 let과 const는 스크립트 스코프나 블록 스코프에 정확히 격리돼요.

예를 들어 for문 안에서 var i = 0;이라고 쓰면 반복문이 끝난 뒤에도 i 값이 남아 있어요. 하지만 let j = 0;으로 쓰면 for문 블록이 끝나는 순간 j는 사라져요. 이 차이 때문에 for문 카운터 변수는 반드시 let을 쓰는 게 안전합니다.

함수 내부에서 var와 let을 동시에 써서 비교해 보면 더 명확해져요. var는 함수 스코프만 따지지만, let은 블록 단위로 스코프를 새로 만들기 때문에 의도치 않은 변수 오염을 막을 수 있어요.

재선언·재할당 규칙과 실전 활용 팁

var는 같은 이름을 또 선언해도 에러 없이 덮어써요. let은 같은 스코프에서 두 번 선언하면 바로 에러가 나요. 이 엄격함 덕분에 실수로 같은 변수를 두 번 만드는 일을 미리 막을 수 있어요.

const는 재선언도, 재할당도 모두 불가능해요. 객체를 담을 때도 const obj = {};라고 선언한 뒤 obj.name = 'test';처럼 내부 속성을 바꾸는 건 가능하지만, obj = {};처럼 통째로 다시 할당하면 에러가 발생해요.

실전에서는 “이 값이 절대 바뀌면 안 된다” 싶으면 const부터 쓰고, 바뀔 가능성이 있으면 let을 쓰는 습관을 들이세요. var는 레거시 코드 유지보수할 때가 아니라면 거의 쓰지 않는 걸 추천해요. 이렇게만 해도 코드가 훨씬 견고해집니다.