[JS] 여러 가지 변수 - var, let, const

var

함수 레벨 범위를 가지는 var

C#을 포함한 많은 프로그래밍 언어는 블록 레벨 범위를 가진다.

이것은 변수가 선언된 블록 내에서만 접근할 수 있다는 것을 의미한다.

하지만 자바스크립트에서 var 키워드로 선언된 변수는 함수 레벨 범위를 가진다.

var로 선언된 변수는 해당 함수 내 어디에서든 접근할 수 있다는 것이다.

따라서 if 문과같이 다른 코드 블록에서 동일한 변수를 var 키워드로 선언하여 사용하여도, 결국 동일한 변수를 가리키게 된다.

이러한 특성 때문에 아래와 같은 코드에서 func1 함수를 호출하면 'World'가 출력된다.

var str1 = 'Hi';

function func1() {
	var str1 = 'Hello';
	if(true) {
		var str1 = 'World';
	}
	return str1; 
}

console.log(func1()); // World
console.log(str1); // Hi

 

 

하지만 이것은 함수 내에서 선언된 var 키워드 변수에 한해서 적용된다.

전역 변수로 선언한 var 변수는 해당되지 않고, let 또는 const 변수는 다른 언어와 마찬가지로 블록 레벨 범위를 가진다.

 

여러 번 선언하기

var로 선언된 변수는 여러 번 선언할 수 있다.

var str1 = 'start'
var str1 = 'Hi Hello'
console.log(str) // Hi Hello

 

let

var 선언왼 변수는 여러 번 선언할 수 있고, 변수 스코프에 의해 예상하지 못 한 결과가 나오기도 한다.

이러한 문제를 해결하기 위해 나온 것이 let이다.

C#과 같은 언어의 지역 변수와 동일하게 동작한다.

 

블록 레벨 범위를 가지는 let과 const

위에서 설명한 것처럼 let과 const는 블록 레벨 범위를 가진다.

따라서 let으로 만들어진 변수는 코드 블록이 끝나면 메모리에서 사라진다.

let str2 = 'Hi';
function func2() {
	let str2 = 'Hello';
  if(true) {
		let str2 = 'World';
	}
	return str2; 
}

console.log(str2); // Hi
console.log(func2()); // Hello

 

한 번만 선언하기

let 키워드로 만들어진 변수는 C#과 같은 언어와 마찬가지로 동일한 블록에서는 한 번만 선언할 수 있다.

let str2 = 'Hi';
let str2 = 'Hi2'; // Uncaught SyntaxError: Identifier 'str2' has already been declared

 

const

let과 유사하지만 상수를 의미하는 const

const는 전체적으로 let과 유사하다.

차이가 있다면 let은 지역 변수로 사용되지만 const는 상수값 할당에 사용된다는 것이다.

따라서 const 선언된 변수는 값을 바꿀 수 없다는 특징이 있다.