JavaScript/JS 변수
var, let, const 차이점
SMASMC
2023. 12. 28. 20:11
변수 선언 방식
1. var : 중복 선언 가능
var name = 'javascript';
console.log(name); // javascript
var name = 'flutter';
console.log(name); // flutter
- var로 선언한 변수는 동일한 이름으로 여러번 중복해서 선언이 가능함. 이와 같은 경우, 마지막에 할당된 값이 변수에 저장된다.
- 장점으로는 필요할 때마다 변수를 유연하게 사용할 수 있다는 점이고,
- 단점으로는 기존에 선언해둔 변수의 존재를 잊고 값을 재할당하는 등의 실수가 발생할 가능성이 있다는 점이다.
위와 같은 단점을 보완하기 위해 ES6부터 추가된 변수 선언 방식이 let 과 const 이다.
2. let : 중복 선언 불가능, 재할당 가능
let name = 'javascript';
console.log(name); // javascript
let name = 'flutter';
console.log(name); // Uncaught SyntaxError: Identifier 'name' has already been declared
name='dart';
console.log(name); // dart
- var 와 다르게 let은 해당 변수가 이미 선언되었다는 에러 메시지가 출력된다.
- name = 'dart' 와 같이 변수 선언 및 초기화 이후 반복해서 다른 값을 재할당 할 수 있다.
3. const : 중복 선언 불가능, 재할당 불가능
const name = 'javascript';
console.log(name); // javascript
const name = 'flutter';
console.log(name);
// Uncaught SyntaxError: Identifier 'name' has already been declared
name = 'dart';
console.log(name);
// Uncaught TypeError: Assignment to constant variable
- let 과 const의 차이점은 immutable(불변)의 여부이다. let은 변수에 다른 값을 재할당할 수 있지만, const는 재할당 시 에러 메시지가 출력된다.
const를 기본으로 사용하여 불필요한 변수의 재사용을 방지하고, 재할당이 필요한 경우 let을 사용하는 것이 좋다.
스코프 (Scope)
- Scope란 유효한 참조 범위를 뜻하며, 기존의 방법인 var로 선언한 변수와 let 또는 const로 선언한 변수의 스코프는 다르다.
1. var : 함수 레벨 스코프 (function-level scope)
function func() {
if (true) {
var a = 5;
console.log(a); // 5
}
console.log(a); // 5
}
func(); // 5
console.log(a); // ReferenceError: a is not defined
- 함수 내에서 선언된 변수는 함수 내에서만 유효하며, 함수 외부에서는 참조할 수 없다.
함수 내부에서 선언한 변수는 지역 변수, 함수 외부에서 선언한 변수는 전역 변수로 취급
2. let, const : 블록 레벨 스코프 (block-level scope)
function func() {
if (true) {
let a = 5;
console.log(a); // 5
}
console.log(a); // ReferenceError: a is not defined
}
console.log(a); // ReferenceError: a is not defined
- founction, if문, for문, while문, try/catch문 등의 모든 코드 블록 ({...}) 내부에서 선언된 변수는 코드 블록 내에서만 유효하다.
코드 블록 내부에서 선언한 변수는 지역 변수로 취급
참고 사이트
https://80000coding.oopy.io/e1721710-536f-43f2-823b-663389f5fbfa