팁

Javascript에서 var, let, const의 차이점

Kstyle83 2023. 3. 18. 15:14
반응형

Javascript에서 변수를 선언할 때, var, let, const의 세 가지 키워드를 사용할 수 있습니다. 이들 키워드는 변수를 선언하는 방식에 따라 차이가 있습니다. 이번 글에서는 var, let, const의 차이점에 대해 알아보겠습니다.

var

var는 ES6 이전에 사용되던 변수 선언 키워드입니다. var로 선언된 변수는 함수 스코프를 가지며, 함수 내에서 선언된 변수는 함수 내에서만 접근할 수 있습니다. 만약 함수 내에서 var로 선언하지 않은 변수를 사용하면, 해당 변수는 전역 변수로 선언됩니다.

function foo() {
  var a = 1;
  if (true) {
    var b = 2;
  }
  console.log(a); // 1
  console.log(b); // 2
}
foo();
console.log(a); // ReferenceError: a is not defined
console.log(b); // 2

위 예제에서 a는 함수 내에서 선언된 변수이므로 함수 내에서만 접근할 수 있습니다. b는 if 문 내에서 선언된 변수이지만, var로 선언되었기 때문에 함수 내에서도 접근할 수 있습니다. 함수 외부에서 b에 접근하면 전역 변수로 선언된 변수에 접근하게 됩니다.

let

let은 ES6에서 추가된 변수 선언 키워드입니다. let으로 선언된 변수는 블록 스코프를 가지며, 블록 내에서만 접근할 수 있습니다. 블록 스코프란 중괄호({})로 둘러싸인 범위를 의미합니다.

function foo() {
  let a = 1;
  if (true) {
    let b = 2;
    console.log(a); // 1
    console.log(b); // 2
  }
  console.log(a); // 1
  console.log(b); // ReferenceError: b is not defined
}
foo();
console.log(a); // ReferenceError: a is not defined

위 예제에서 a와 b는 블록 내에서 선언된 변수이므로 블록 내에서만 접근할 수 있습니다. 함수 외부에서 a와 b에 접근하면 ReferenceError가 발생합니다.

const

const는 let과 마찬가지로 ES6에서 추가된 변수 선언 키워드입니다. const로 선언된 변수는 상수로써, 값을 변경할 수 없습니다. const로 선언된 변수는 let과 마찬가지로 블록 스코프를 가지며, 블록 내에서만 접근할 수 있습니다.

function foo() {
  const a = 1;
  if (true) {
    const b = 2;
    console.log(a); // 1
    console.log(b); // 2
  }
  console.log(a); // 1
  console.log(b); // ReferenceError: b is not defined
}
foo();
console.log(a); // ReferenceError: a is not defined

위 예제에서 a와 b는 블록 내에서 선언된 변수이므로 블록 내에서만 접근할 수 있습니다. 또한, const로 선언된 변수는 값을 변경할 수 없기 때문에, 다음과 같이 값을 변경하려고 하면 TypeError가 발생합니다.

const a = 1;
a = 2; // TypeError: Assignment to constant variable.

 

var, let, const는 변수를 선언하는 방식에 따라 차이가 있습니다. var는 함수 스코프, let과 const는 블록 스코프를 가지며, const는 값을 변경할 수 없는 상수입니다. 변수를 선언할 때, 변수의 스코프와 값의 변경 가능 여부를 고려하여 적절한 키워드를 선택해야 합니다.

반응형