-
var, let, const 차이점JavaScript/JS 변수 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
'JavaScript > JS 변수' 카테고리의 다른 글
module, exports, require (1) 2024.01.30 JS Console 활용 (1) 2024.01.28