[JS] 자바스크립트 변수 선언 방식의 차이점(var, let, const)

 

변수 선언

 - 변수 선언은 var, let, const 로 할 수 있으며, E56에서 const와 let이 추가되었습니다.

 

변수 선언 방식의 차이점

	var	let	const
중복선언	가능	불가능	불가능
재할당	가능	가능	불가능
스코프(Scope)	함수 레벨	블록 레벨	블록 레벨

 

 

#1. 중복선언

 - var, let, const 로 중복 선언시 아래와 같다.

 

 1) var : 중복 가능

//var
var test = 10;			//첫번째 변수 선언 및 초기화
console.log(test); 		// 10

var test = 20;			//두번째 변수 선언 및 초기화
console.log(test); 		// 20

 2) let, const : 중복 불가능

//let
let test = 10;			
let test = 20;			//SyntaxError: Identifier 'test' has already been declared

//const
const test = 10;			
const test = 20;		//SyntaxError: Identifier 'test' has already been declared

 

 

#2. 재할당

 - var, let, const 로 재할당시 아래와 같다.

 

 1) var, let : 재할당 가능

//var
var test = 10;
test = 20;
console.log(test)		// 20

//let
let test = 10;
test = 20;
console.log(test)		// 20

 2) const : 재할당 불가능

//const
const test = 10;			
test = 20;			//TypeError: Assignment to constant variable.

 

 

 

#3. 스코프(Scope) : 유효범위

 - 스코프(유효범위)란 해당 변수가 정의되어 있는 영역, 즉 정의된 변수를 사용할 수 있는 소스코드의 집합을 말한다.

 

 1) var : 함수 레벨 스코프(function-level scope)

 - var은 함수 내부에서 선언된 변수만 지역변수로 한정하며, 나머지는 모두 전역변수로 간주한다.

var test = 10;

if (true) {
  var test = 20;
}

console.log(test);		// 20

- scopeTest 함수 내부에서 선언된 변수는 함수 내부에서만 참조가 가능하며, 외부에서 참조시 에러가 발생한다.

 

 

2) let, const : 블록 레벨 스코프(block-level-scope)

 - let과 const로 선언된 변수는 모든 코드 블록(function, if, for, while, try/catch 등)을 지역 변수로 취급한다.

let test = 10;

if (true) {
  let test = 20;
}

console.log(test);		// 10