let, const , var 비교 분석

 

js에서 변수 선언할 때 사용하는 것이 3가지 있다.

var, let, const

처음에 js를 시작했을 때에는 var를 사용하는 것이 편하여 변수 선언을 거의 var를 사용하였는데

조금 더 해보니 let 혹은 const 위주로 사용하게 되었다. 그 이유를 설명하기 전에

간단하게 var, let, const를 확인해보고 다른점을 비교 분석 무엇을 사용하는 것이 좋은지에 대해 알려 주겠습니다.

var 와 let, const의 차이는 무엇인가?

var는 function scoped

let과 const 는 block scoped 입니다.

 

그럼 function scoped와 block scoped는 무엇인가요??

 

scoped는 경계선으로 이해하면 될 것이다. 앞에 뭐가 붙였냐에 따라서 경계선의 기준을 정하는 것이다.

그럼 function scoped는 선언된 함수를 기준으로 block scoped는 {}를 기준으로 한다고 생각하면 된다.

뒤에 예제를 확인해 보면 알 수 있습니다.

 

일단 var의 코드예제 입니다.

function VarTest () {
 //호이스팅이 되는 자리
  for(var i = 0; i < 5; i++){
   console.log("????");
   }
  console.log("i는 var로 선언", i);
}
VarTest();
console.log("i가 여기서 불릴까:", i);

/*'????'
'????'
'????'
'????'
'????'
'i는 var로 선언' 5
ReferenceError: i is not defined */

 

var로 선언이 되어있는 i는 자신이 선언 되어 있는 함수를 벗어나니 i는 선언이 되어 있지 않다는 에러가 뜹니다.

그러면 i는 for 문 안에 선어 되어 있는 데 어떻게 for 문을 벗어난 뒤에도 i의 값을 확인 할 수 있는 것일까요?

바로 호이스팅이 되어 var로 선언이 되어있는 i는 자동으로 맨 상위에서 올라가서 선언이 되는 것이다.

 

그러면 다음은 let, const

let과 const는 block scoped를 따르며 {}(scope)이 기준이라고 생각하면 된다.

예제를 보면

function LetTest () {
  for(let i = 0; i < 5; i++){
   console.log("????", i);
   }
  console.log("i는 var로 선언", i);
}
LetTest();
console.log("i가 여기서 불릴까:", i);

/*?
'????' 0
'????' 1
'????' 2
'????' 3
'????' 4
ReferenceError: i is not defined
ReferenceError: i is not defined
*/

 

for 문 안에서 i를 let으로 선언 했을 때 for 문을 벗어나니 i의 값을 불러 올 수 없다는 것을 알 수 있습니다.

 

const 와 let의 차이

let LET = "test";
LET = "let";
let LET = "Err" //undefined: Duplicate declaration "LET"

const CONST = "test";
CONST = "const"; // TypeError: Assignment to constant variable.

 

이와 같이 let으로 선언되어 있으면 변수에 다른 값을 넣을 수 는 있지만 동일한 이름으로 다시 선언 하는 것은 할 수 없습니다.

 

하지만 const의 경우에는 오직 선언되어 있는 값만 허용이 되며 동일한 이름으로 다시 선언하는 것 또는 선언되어 있는 변수에 다른 값을 엏으려고 한는 것을 할 수 없습니다.

 

(var의 선언 같은 경우에는 변수 값 변경, 동일한 이름으로 다시 선언 하는 것 둘다 가능합니다.)

 

사용하는데 var보다는 let, const를 사용하는 이유

 

var로 선언되는 경우 같은 이름으로 중복 선언이 가능하기 때문에 이 점이 코드를 치다 보면 문제가 발생할 수 있습니다.

만약에 나도 모르게 test라는 변수를 같은 함수 내에서 var로 두 번 선언을 했다고 하면 첫번째 선언된 test의 값은 없어지게 됩니다.

이러한 경우가 일어 날 수 있으니 이러한 경우에는 let을 이용하면 됩니다.

 

const를 사용하는 경우에는 어떤 변수는 값을 변경할 필요가 없고 변경되면 안되는 변수 일 경우에는 const를 이용하여 변수를 선언해 주면 됩니다.