[JavaScript] 변수 선언 - var, let, const

var

변수를 의미하는 variable를 줄인 것으로, 최초 선언 후 재선언과 재할당 모두 가능하다.

var x = "JS";
var x = "React";

console.log(x);
// React

var y = "React";
y = "JS";

console.log(y);
// JS

 

const

const는 상수란 뜻으로, 최초 선언 후 재선언 및 재할당이 불가능한 변수이다.

const x = "JS";
x = "React";

console.log(x);
// TypeError: Assignment to constant variable.

또한, 최초 선언 시 값을 입력해주지 않으면 에러가 난다.

const x;
x = "JS"

console.log(x);
// SyntaxError: Missing initializer in const declaration

 

let

const와 다르게, 최초 선언 후 재선언은 되지 않지만, 재할당은 가능하다.

// 재선언 불가

let x = "JS";
let x = "React";

console.log(x);
// SyntaxError: Identifier 'x' has already been declared

// 재할당 가능

let x = "JS";
x = "React";

console.log(x);
// React

 

var 🆚 let, const

ES6 등장 이후에는 최대한 var의 사용을 지양하고 let과 const를 사용하도록 권고한다.

 

우선 두 케이스의 가장 큰 차이점은 스코프가 다르다는 것이다.

 

var은 함수 스코프를 가지고, let과 const는 블록 스코프(if, while, for, function 등의 중괄호)를 가진다.

 

즉, let과 const로 선언된 변수들은 블록 외부에서는 접근할 수 없고, var는 정의만 되면 함수의 모든 곳에서 사용 가능하다.

 

if (true) {
  var x = "JS";
};

console.log(x);
// JS

if (true) {
  const x = "JS";
};

console.log(x);
// ReferenceError: x is not defined

var로 선언된 변수는 얼핏보면 매우 유연해 보이지만, 그만큼 코드 규모가 조금만 커지면 수 많은 변수들을 관리하기 어려워진다는 특징이 있다.

 

또한, JavaScript를 이용할 때 한 번 초기화 한 변수에 대해 다른 값을 재할당하는 경우는 그렇게 많지 않다.

 

따라서 var이 갖는 유연함이라는 특징은 그것이 초래할 수 있는 위험성에 비해 그다지 큰 메리트가 아니다.

 

 

결론적으로,

 

변수를 선언할 때 가능한 const를 사용하고, 재할당이 필요한 경우에는 let으로 대체한다.