`let`, `const`, `var`의 차이점 이해하기: JavaScript 초보자용 가이드
카테고리
프로그래밍/소프트웨어 개발
서브카테고리
웹 개발
대상자
JavaScript 초보자 및 기초를 다지는 개발자
핵심 요약
var는 함수 범위를 가지며, 재선언 가능하고 호이스팅을 지원하지만 값은 초기화 전에는undefinedlet은 블록 범위를 가지며, 재선언 불가하고 호이스팅 시 'Temporal Dead Zone' 발생const는 블록 범위를 가지며, 초기화 필수이고 재할당 불가 (객체/배열의 경우 내부 값은 변경 가능)
섹션별 세부 요약
1. `var`의 특징
- 함수 범위를 가지며, 함수 외부에서 선언 시 전역 범위로 간주
- 호이스팅 시 선언만 상위로 이동, 값은 초기화 전
undefined - 재선언 허용 (
var a = 5; var a = 10;) → 큰 코드베이스에서 오류 발생 가능성 - 예시:
```javascript
console.log(a); // undefined
var a = 10;
```
2. `let`의 특징
- 블록 범위를 가지며, 재선언 불가 (
let y = 10; let y = 20;→SyntaxError) - 호이스팅 시 'Temporal Dead Zone' 발생 → 선언 전 참조 시
ReferenceError - 예시:
```javascript
console.log(x); // ReferenceError
let x = 10;
```
3. `const`의 특징
- 블록 범위를 가지며, 초기화 필수 (
const z;→SyntaxError) - 재할당 불가 (
const pi = 3.14; pi = 3.1415;→TypeError) - 객체/배열의 경우 내부 값은 변경 가능 (예:
const arr = [1,2,3]; arr.push(4);→ 가능)
4. 실무 권장사항
- 기본적으로
const사용 → 값 변경이 필요하지 않을 때 명확성 제공 - 값이 변경될 경우만
let사용 var은 유추 코드 외 사용 자제 → 예측 불가능한 동작 방지
결론
const를 기본으로 사용하고let은 변경이 필요한 경우만 사용하는 것이 코드 가독성 및 유지보수성 향상에 유리var은 호이스팅과 재선언 문제로 인해 신규 프로젝트에서 피해야 함- ES6(2015) 이후 표준으로
let과const사용을 통해 더 안정적인 JavaScript 개발 가능