자바스크립트 const var let 차이점
자바스크립트의 변수 선언 방식은 크게 세가지가 있습니다.
var, let, const 이렇게 세 가지가 있는데 이 차이점에 대해서 알아보고 어떤 상황에서 셋 중 어느 선언 방식을 사용하는게 좋을지에 대해서 알려드리겠습니다.
var
var(재선언 가능)
var는 변수 선언 방식에 있어서 큰 단점을 가지고 있습니다
var name = 'gather'
console.log(name) // gather
var name = 'javascript'
console.log(name) // javascript
변수를 한 번 더 선언했음에도 불구하고, 에러가 나오지 않고 각기 다른 값이 출력되는 것을 볼 수 있습니다.
매우 유연한 변수 선언으로 간편하게 선언을 하여 간단한 테스트에는 편리 할 수 있겠으나
몇가지 문제점을 가지고 있습니다
코드량이 많아 진다면 어디에서 어떻게 사용 될지도 파악하기 힘들고 값이 바뀔 우려가 있습니다.
ECMA Script6 ES6(ES2015)이후, 이를 보완하기 위해 추가 된 변수 선언 방식이 let 과 const 입니다.
이전에는 사용할 수 있는 변수 선언은 var 뿐이서 어쩔 수 없이 사용 중이 였습니다.
var는 함수 레벨 스코프이고 let, const는 블럭 레벨 스코프입니다.
let(재선언 불가능, 재할당 가능)
let name = 'gather'
console.log(name) // gather
let name = 'javascript'
console.log(name) // Uncaught SyntaxError: Identifier 'name' has already been declared
name이 이미 선언 되었다는 에러 메세지를 띄워줍니다. (const도 동일)
변수 재선언이 되지 않습니다.
let 과 const 의 차이점은?
이 둘의 차이점은 immutable(불변) 여부입니다.
let 은 변수에 재할당이 가능합니다.
let name = 'gather' console.log(name) // gather
let name = 'javascript' console.log(name) // Uncaught SyntaxError: Identifier 'name' has already been declared
name = 'react' console.log(name) // react
const(재선언, 변수 재할당 모두 불가능)
const name = 'gather' console.log(name) // gather
const name = 'javascript' console.log(name) // Uncaught SyntaxError: Identifier 'name' has already been declared
name = 'react' console.log(name) //Uncaught TypeError: Assignment to constant variable.
변수나 함수를 첫 줄에 호출하고 마지막에 함수나 변수를 정의해도 무리 없이 작동하도록 하는 것이 자바스크립트에는 있습니다.
이것을 호이스팅이라고 합니다.
호이스팅(Hoisting)이란?
변수를 선언하기 이전에 참조할 수 있는 것을 말합니다.
var 선언문이나 function 선언문 등을 해당 스코프의 선두로 옮긴 것처럼 동작하는 특성을 말합니다.
자바스크립트는 ES6에서 도입된 let, const를 포함하여 모든 선언(var, let, const, function, function*, class)을 호이스팅합니다.
var 로 선언된 변수와는 달리 let 로 선언된 변수를 선언문 이전에 참조하면 참조 에러(ReferenceError)가 발생합니다.
console.log(foo); // undefined var foo;
console.log(hois); // Error: Uncaught ReferenceError: bar is not defined let hois;
정리
어떤 변수 선언 방식을 써야할까?
변수 선언에는 기본적으로 const를 사용하고, 재할당이 필요한 경우에 한정해 let 을 사용하는 것이 좋습니다.
객체를 재할당하는 경우는 생각보다 흔하지 않습니다. const 를 사용하면 의도치 않은 재할당을 방지해 주기 때문에 let 보다 안전합니다.