JavaScript var, let, const의 정의와 차이점 알아보기

JavaScript에서 변수를 선언할 때는 var, let, const 세 가지 키워드를 사용할 수 있습니다. 이번 글에서는 이들의 차이점과 각각의 특징에 대해 알아보겠습니다.

 

JavaScript var, let, const의 정의

var

var는 ES5 이전부터 사용되었던 변수 선언 방법입니다. var로 선언된 변수는 함수 스코프를 가지며, 전역 변수로도 사용할 수 있습니다.

var x = 10; // 전역 변수
function foo() {
  var y = 20; // 함수 스코프 변수
  if (true) {
    var z = 30; // 함수 스코프 변수
  }
}

하지만, var로 선언된 변수는 호이스팅(hoisting) 현상이 발생합니다. 이는 변수를 선언하기 전에도 사용할 수 있게 되는 것으로, 예측하지 못한 동작을 초래할 수 있습니다.

 

let

let은 ES6에서 도입된 새로운 변수 선언 방법입니다. let으로 선언된 변수는 블록 스코프를 가지며, 호이스팅이 발생하지 않습니다.

let x = 10; // 블록 스코프 변수
function foo() {
  let y = 20; // 블록 스코프 변수
  if (true) {
    let z = 30; // 블록 스코프 변수
  }
}

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

let x = 10;
x = 20;

하지만, let으로 선언된 변수는 선언 후 초기화되지 않으면 에러가 발생합니다.

let x; // 선언은 가능
console.log(x); // undefined

 

 

const

const는 let과 마찬가지로 ES6에서 도입된 변수 선언 방법입니다. const로 선언된 변수는 블록 스코프를 가지며, 호이스팅이 발생하지 않습니다.

const x = 10; // 블록 스코프 상수

 

const로 선언된 변수는 재할당이 불가능합니다.

const x = 10;
x = 20; // TypeError: Assignment to constant variable.​

 

하지만, 객체나 배열 같은 참조 타입의 데이터는 변경 가능합니다.

const arr = [1, 2, 3];
arr.push(4);
console.log(arr); // [1, 2, 3, 4]

 

var, let, const의 차이점

• 변수의 범위: var는 함수 스코프를 가지며, let과 const는 블록 스코프를 가집니다.
• 호이스팅: var는 호이스팅이 발생하여 선언 전에도 사용할 수 있지만, let과 const는 호이스팅이 발생하지 않습니다.
• 재할당 가능 여부: var와 let은 재할당이 가능하지만, const는 한 번 선언된 값은 변경이 불가능합니다.
• 초기화: var와 let은 초기화하지 않아도 자동으로 undefined로 초기화되지만, const는 반드시 선언과 동시에 초기화해야 합니다.
• 전역 객체와의 연관: var로 선언된 변수는 전역 객체의 프로퍼티로 취급되지만, let과 const는 그렇지 않습니다.
• 선언 시점: var는 함수가 실행되는 동안 변수를 선언하므로, 함수 내 어디서든 변수에 접근할 수 있습니다. 반면 let과 const는 블록이 실행되기 전에 선언되어야 합니다.

위와 같은 차이점이 있으며, 변수의 선언 방식은 사용하려는 목적에 따라 적절하게 선택해야 합니다. var는 호이스팅으로 인한 문제가 발생할 가능성이 있기 때문에, 가급적 let이나 const를 사용하는 것이 좋습니다. let은 재할당이 필요한 경우, const는 값이 변경되지 않아야 하는 경우에 사용하면 됩니다.