Post

var, let, const개념정리

JS 변수 선언 방식의 종류를 알아보자.

var, let, const 변수 차이점


이 3가지 변수 선언 방식의 차이점은 변수의 범위(scope)와 값의 재할당 여부이다.
이 중에서도 오랫동안 사용되어 왔던 var의 몇가지 문제점을 먼저 설명하고, letconst를 알아보겠다.


var


var는 가장 오래된 변수 선언 방식이다. ES5 이전에 주로 사용되었다.

함수 스코프

var로 선언된 변수는 함수 스코프를 가진다.
이는 변수가 선언된 함수 내에서만 유효하다는 것을 의미한다.
이러한 혼동은 코드를 이해하기 어렵게 만들 수 있다.

호이스팅

var로 선언된 변수는 선언하기 전에 사용할 수 있다.
이는 코드의 구조를 이해하기 어렵게 만들고, 예상치 못한 결과를 초래할 수 있다.

전역 변수의 오염

var로 선언된 변수는 전역 범위에 변수를 추가하므로 다른 스크립트 파일과 충돌하거나
예상치 못한 동작을 일으킬 수 있다.

의도하지 않는 값 변경

var로 선언된 변수는 값의 재할당이 자유롭기 때문에 의도치 않은 값 변경이 발생할 수 있다.

블록 스코프내에서의 변수 유효범위 문제점

var는 함수 스코프를 가지기때문에 블록 스코프를 형성하지 않는다.
이는 블록 내에서 선언된 변수가 블록을 벗어난 후에도 유효하게 동작될 수 있기때문에
의도와 다르게 흘러가는 문제가 발생한다.

이러한 문제점으로 인해 ES6에서 letconst가 도입되었다.


let(블록 스코프)


let은 블록 스코프를 갖는 변수이다. 이는 변수가 선언된 블록 내에서만 유효하다.
함수 스코프로 인한 혼란도 줄여주고, 블록 단위의 변수 범위를 정의할 수 있다.

1
2
3
4
5
6
7
8
9
10
11
function example() {
  let x = 10;
  if (true) {
    let y = 20;
    console.log(x); // 출력: 10
    console.log(y); // 출력: 20
  }
  console.log(x); // 출력: 10
  console.log(y); // 에러: y는 정의되지 않는다.
}

const(상수 선언)


const는 상수를 선언하는데 사용된다. 한번 값을 할당하면 변경 불가능하다.
이를 통해 코드의 가독성을 높이고 의도치않은 값 변경을 방지한다.

1
2
const PI = 3.14;
PI = 3; // 에러: 상수에 새로운 값을 할당할 수 없음

재할당에 대한 주의사항


let은 값을 재할당할 수 있지만, const는 한번 할당 한 이후에는 재할당 불가능하다.
하지만 const로 선언된 객체나 배열의 내부 값은 변경가능하다.

1
2
3
4
5
6
7
8
9
10
let num = 10;
num = 20; // 가능

const PI = 3.14;
PI = 3; // 에러: 재할당 불가

const arr = [1, 2, 3];
arr.push(4); // const는 배열, 객체 내부값 변경 가능
console.log(arr); // 출력: [1, 2, 3, 4]


결론


letconst는 ES6에서 도입된 새로운 변수 선언 방식으로,
변수의 범위를 더 명확하게 제어하고 값의 불변성을 보장한다.

또한 코드의 가독성을 향상시키고, 예기치 못한 버그를 방지할 수 있다.

This post is licensed under CC BY 4.0 by the author.