자바스크립트는 변수의 스코프(scope)를 결정하기 위해 함수 범위(function scope)를 사용합니다. 하지만 ES6(ECMAScript 2015)부터는 블록 범위(block scope) 변수를 도입하여 변수의 유효 범위를 블록 단위로 제한할 수 있게 되었습니다. 이러한 블록 범위 변수의 선언에는 let과 const 키워드를 사용합니다.

let 키워드

let은 블록 범위 지역 변수를 선언하는 데 사용되는 키워드입니다. let으로 선언된 변수는 해당 블록 안에서만 유효하며, 블록을 벗어나면 변수에 접근할 수 없습니다. 이를 통해 변수 유효 범위 충돌이나 오류를 방지할 수 있습니다.

function foo() {
  if (true) {
    let x = 10;
    console.log(x); // 출력: 10
  }
  console.log(x); // 오류: ReferenceError: x is not defined
}

foo();

위의 예제에서 let x = 10;은 if 문의 블록 안에서만 선언된 변수입니다. 블록을 벗어나면 변수에 접근할 수 없으므로 console.log(x);에서 ReferenceError가 발생합니다.

const 키워드

const는 블록 범위 상수를 선언하는 데 사용되는 키워드입니다. const로 선언된 변수는 초기에 값을 할당하고 나면 변경할 수 없습니다. 또한 const로 선언된 변수는 블록 내에서만 유효하며, 블록을 벗어나면 접근할 수 없습니다.

function foo() {
  if (true) {
    const PI = 3.14;
    console.log(PI); // 출력: 3.14
    PI = 3.14159; // 오류: TypeError: Assignment to constant variable.
  }
  console.log(PI); // 오류: ReferenceError: PI is not defined
}

foo();

위의 예제에서 const PI = 3.14;은 if 문의 블록 안에서 상수를 선언합니다. 초기 값으로 할당된 상수는 변경할 수 없으므로 PI = 3.14159;에서 TypeError가 발생합니다. 또한 블록 밖에서 PI에 접근하려고 하면 ReferenceError가 발생합니다.

let vs const

let과 const의 차이점은 변수의 가변성에 있습니다. let으로 선언된 변수는 값을 변경할 수 있지만, const로 선언된 변수는 값을 변경할 수 없습니다. 따라서 const는 상수를 선언할 때 사용하고, let은 가변적인 값을 다룰 때 사용하는 것이 좋습니다.

결론

ES6부터 도입된 let과 const를 사용하여 자바스크립트 코드의 변수 유효 범위를 블록 단위로 제한할 수 있습니다. let은 변수를 선언할 때 사용하고, const는 상수를 선언할 때 사용합니다. 이를 통해 코드의 가독성과 유지 보수성을 향상시킬 수 있습니다.