[JavaScript] 변수 선언 시 var, let, const의 차이

자바스크립트는 매니지드 언어(managed language)이다. 이는 개발자가 직접 메모리를 제어하지 못한다는 것을 뜻한다. 파이썬과 같이 직접 메모리 주소를 통해 값을 저장하고 참조할 필요가 없고 변수를 통해 안전하게 값에 접근이 가능하다. 여기서 ES6 이후부터 var, let, const로 변수를 선언할 수 있는데 각각의 차이점을 잘 알고 사용하는 것이 좋다.

 

1. var

• 변수 재선언 가능
• 함수 스코프(functional scope)로 호이스팅이 발생

2. let

• 변수 재선언 불가능
• 변수 재할당 가능
• 블록 스코프(block scope)로 호이스팅이 발생

3. const

• 변수 재선언 불가능
• 변수 재할당 불가능
• 블록 스코프(block scope)로 호이스팅이 발생

 

console.log(a);
var a = "test var";

console.log(b);     // error
let b = "test let";

console.log(b);     // error
const b = "test const";

 

위의 예제로 선언이 코드 실행보다 먼저 메모리에 저장되는 과정으로 인해 야기되는 현상인 호이스팅에 관한 내용을 확인할 수 있다.

호이스팅에 대한 자세한 내용은 아래를 참조 바란다.

https://aliencoder.tistory.com/14

[JavaScript] 호이스팅(Hoisting)

 

아래는 함수 스코프와 블록 스코프에 대한 예제이다.

먼저 함수 스코프란 함수 내에서 선언된 변수는 함수 내에서만 유효하며 함수 외부에서는 참조할 수 없다. 즉, 함수 내부에서 선언한 변수는 지역 변수이며 함수 외부에서 선언한 변수는 모두 전역 변수이다. 예제는 아래와 같다.

 

var val;
function testFunc(val){
    for(var i=0; i<10; i++){}
    console.log(i);
    val = i+val;
}
testFunc(5);
console.log(val);

 

아래는 {}와 같은 블록의 영역에 영향을 끼치는 블록 스코프에 대한 예제이다. 블록 스코프는 함수 내에서 선언된 변수는 함수 내에서만 유효하며 함수 외부에서는 참조할 수 없다. 즉, 함수 내부에서 선언한 변수는 지역 변수이며 함수 외부에서 선언한 변수는 모두 전역 변수이다. 이렇게 사용하면 에러를 반환하는데 let과 const는 블록 스코프이기 때문이다.

 

function testFunc2(){
    for(let i=0; i<10; i++){}
    console.log(i);
}
testFunc2();

 

결론적으론 재할당이 필요 없는 경우 const로 선언해 불필요한 변수의 재사용을 방지하고, 재할당이 필요한 경우 let을 사용하는 것이 차후 변수들을 관리할 때 유용할 것으로 생각된다.