반응형

기존의 Javascript에서는 변수선언할 때 기본적으로 variable을 줄인 var를 사용했습니다만 ES2015(ES6)에서 letconst가 추가되었습니다. 기존의 var 선언과 다른 점이 있기 때문에 추가된 것이겠죠? var, let, const는 각각의 역할을 가지고 있습니다. 당연한 이야기겠지만 Javascript 개발자들은 이 세 가지의 차이점을 잘 알고 사용하는 것이 필요할 것입니다. 


var 선언

같은 변수명으로 중복 사용이 가능합니다. 여러번 중복으로 사용될 경우 가장 마지막으로 할당된 값이 변수에 저장됩니다. 따라서 var은 재선언되고 업데이트 가능합니다.

var greeting = "hi";
console.log(greeting);
// 출력 : hi

var greeting = "안녕하세요";
console.log(greeting);
// 출력 : 안녕하세요

 

var 사용은 아주 간편하지만 중복 사용이 가능하기 때문에 생기는 문제점이 있습니다. 코드의 다른 부분에서 같은 이름의 변수를 사용한 적이 있다면 출력 결과가 달라질 수 있습니다. 위의 코드 예제에서 greeting을 통해 "hi"를 출력하고 싶었는데 아래에 같은 이름의 변수로 "안녕하세요"가 선언되었기 때문에 greeting은 최종적으로 "안녕하세요"를 출력합니다. 혼자 작업하는 경우라면 이를 방지하기 위해 기억해두거나 메모를 해둘 수 있겠지만, 여럿이 협업하는 경우라면 문제가 생길 가능성이 있습니다.

 

let 선언

let은 var 선언의 문제점인 중복문제를 해결하면서도 재선언이 가능합니다. 

 

let greeting = "hi";
console.log(greeting);
// 출력 : hi

let greeting = "안녕하세요";
console.log(greeting);
// 출력 시 Syntax Error 발생. 변수 greeting이 이미 선언되었다는 에러 메시지 출력 

greeting = "gracias";
console.log(greeting);
// 출력 : gracias

 

let을 사용한 변수와 같은 이름으로 다시 let 선언하면 Syntax 에러 메시지가 출력됩니다. 어느 부분에서 문제가 생겼는지 확인한 후에 변수를 업데이트할 것인지 변수명 자체를 수정할지 결정하면 됩니다.

 

const 선언

let은 재선언을 통해서 업데이트가 가능하지만 const는 업데이트도 불가능합니다. 

 

const greeting = "hi";
console.log(greeting);
// 출력 : hi

const greeting = "안녕하세요";
console.log(greeting);
// 출력 시 Syntax Error 발생. 변수 greeting이 이미 선언되었다는 에러 메시지 출력 

greeting = "gracias";
console.log(greeting);
// 출력 시 Type Error 발생.

 

const로 선언된 변수는 일정한 상수값을 유지하게 됩니다. 따라서 중복 사용도 재선언을 통한 업데이트도 할 수 없습니다. 따라서 const 선언의 경우 선언하는 시점에 초기화가 되어야합니다.

 


var, let, const라는 변수를 선언하는 세 가지 방법의 차이를 확실하게 구분하고 필요한 상황에 맞는 방법을 사용하면 되겠습니다.

반응형

+ Recent posts