본문 바로가기
카테고리 없음

자바스크립트 var let const 차이 완벽 비교

by 기록하는 거부기 2025. 7. 21.

자바스크립트에서 변수를 선언할 때 사용하는 키워드는 var, let, const가 있습니다.
ES6 이전에는 var만 사용되었지만, 최근에는 대부분의 코드가 letconst를 사용하고 있습니다.
이번 글에서는 자바스크립트의 var, let, const의 차이점을 명확히 비교하고, 어떤 상황에서 어떤 키워드를 사용하는 것이 적절한지 정리해보겠습니다.


1. 변수 선언 키워드가 중요한 이유

자바스크립트는 동적 타입 언어로, 변수의 선언과 스코프 관리가 매우 중요합니다.
특히 비동기 처리나 반복문, 조건문 안에서의 변수 동작은 선언 키워드에 따라 완전히 달라질 수 있습니다.
올바른 키워드를 선택하지 않으면 의도하지 않은 변수 오염, 호이스팅 문제, 유지보수 어려움으로 이어질 수 있습니다.


2. var의 특징과 한계

var는 자바스크립트 초창기부터 존재하던 변수 선언 방식입니다.

var x = 10;
  • 함수 스코프(function scope)
  • 중복 선언 허용 (의도치 않은 재정의 발생 위험)
  • 호이스팅 발생: 선언만 끌어올려지고 초기화는 나중에 처리됨
console.log(a); // undefined
var a = 5;

⚠️ var는 의도치 않은 동작을 유발할 수 있어, 현대 자바스크립트에서는 거의 사용되지 않습니다.


3. let의 특성과 블록 스코프

let은 ES6(ES2015)에서 도입된 변수 선언 키워드로, 대부분의 경우 var를 대체합니다.

let x = 10;
  • 블록 스코프(block scope): 중괄호 내부에서만 유효
  • 중복 선언 불가 (같은 스코프 내에서는 오류 발생)
  • TDZ(Temporal Dead Zone) 존재: 선언 전 접근 시 오류
{
  let y = 20;
  console.log(y); // 20
}
// console.log(y); // 오류

✅ 제어문, 반복문 등에서의 변수 선언에는 반드시 let 사용을 권장합니다.

 


4. const의 불변성과 사용 주의점

const는 상수를 선언할 때 사용하며, 선언과 동시에 초기화가 반드시 필요합니다.

const pi = 3.14;
  • 값 재할당 불가 (단, 객체 내부 속성은 변경 가능)
  • 블록 스코프를 따름
  • 읽기 전용 변수로 안정적인 코드 구현 가능
const arr = [1, 2, 3];
arr.push(4);      // 가능 (배열 내부 변경)
arr = [5, 6, 7];  // 오류 (재할당 불가)

⚠️ const는 불변 객체를 만드는 것이 아닌, 변수 재할당만 막는 키워드입니다.

 


5. 실무에서의 추천 사용 기준

상황 추천 키워드
기본 변수 선언 const (우선 사용)
값이 바뀔 수 있는 변수 let
함수/제어문 내부 변수 let
전역 혹은 복잡한 구조에서 절대 var 사용 지양
  • 우선 const, 그다음 필요에 따라 let
  • var는 과거 코드 유지보수를 제외하면 사용 금지에 가깝습니다

✅ 마무리

자바스크립트에서의 변수 선언은 단순한 문법 요소가 아니라, 스코프 관리, 오류 예방, 코드 안정성에 직결되는 핵심 개념입니다.
var는 더 이상 사용하지 않고, 대부분의 경우 불변을 기본으로 하는 const, 필요할 때만 let을 사용하는 패턴이 현대 자바스크립트의 표준입니다.
이 차이를 정확히 이해하면 클린하고 예측 가능한 코드를 작성할 수 있습니다.