[JavaScript] var, let, const 비교

 

var, let, const 비교

	var	let	const
Scope	Function level	Block level
재선언 가능여부	O	X
재할당 가능여부	O		X

 

var는 function level scope를 가지고 있어 함수 내에서

선언 시 해당 함수 내에서만 유효하다. 또한 함수 내에서는

블록 내외부에 관계없이 유효하다.

하지만 함수 외부에서는 참조가 불가능하다.  만약 var가 함수가

아닌 if문, for문, try/catch문에서 선언될 경우 해당 블록 밖에서도 인식된다.

 

이와 달리 let과 const는 block level scope를 가지며,

모든 코드블록 내에서 선언될 경우 해당 변수는

블록 내부에서만 유효하다. (블록 외부에서는 참조가 불가능하다.)

 

var는 유일하게 재선언이 가능하며, let과const는 재선언이 불가하다.

var와 let은 재할당이 가능한데 반해 const의 경우는 유일하게 재할당이

불가능하다는 특징을 가진다.

 

초반에 헷갈렸던 점이 있는데, 바로 var, let, const가 자료형이라고

생각했던 것이다. 이 세 가지는 엄밀히 말하면 자료형이 아니라

변수를 선언하는 키워드라 보는 것이 적절하다. 

 

재할당이 필요없는 상수와 객체에는 기본적으로 const를

사용하는 것이 좋다. 의도치 않은 재할당을 방지해주기 때문에 안전하기

때문이다. 만약 재할당이 필요한 경우 한정적으로 let을 사용하는 것이 좋다.

단, 이 때 변수의 스코프는 최대한 좁게 만드는 것이 좋다.

 

var, let, const 예시

 

예시 1)

if(true) {
    var a = 30
    console.log(a) //30
}
console.log(a) //30

 

*block scope 내에 var명령어로 선언된 변수가

block 밖에서도 인식된다.(문제가 될 수 있음)

 

예시 2) 

if(true) {
    let aa = 30
    console.log(aa) //30
}
console.log(aa) //에러

 

따로 console.log(aa) 실행 시 에러가 발생한다.

let은 if문의 block 내에서만 인식된다.

 

예시 3) 

function test2(){
    let bb = 20
    console.log(bb) //20
}
console.log(bb) //에러

 

let은 function 블록 내(function scope 내)에서만 인식된다.

 

 

예시 4)  오류가 나는  라인 확인(.x표시) 하기

01 function test3(a){
02   var aa=a;
03    let cc=30;
04    if(true){
05        var dd=50;
06        let ee=60;  
07    }
08    console.log(aa); //22
09    console.log(cc); //30
10    console.log(dd); //50
11    console.log(ee);  X – 참조불가
12    ee=ee+20;
13    dd=dd+20;
14    console.log("---------------");
15    console.log(aa); //22
16    console.log(cc); //30
17    console.log(dd); //50
18    console.log(ee);  X – 참조불가
19 }
20 if(true){
21    var ff=30;
22    let  gg=40;
23    console.log(ff); //30
24    console.log(gg); //40
25 }
26 test3(22);
27 console.log(aa); X – 참조불가
28 console.log(cc); X – 참조불가
29 console.log(dd); X – 참조불가
30 console.log(ee); X – 참조불가
31 console.log(ff); //30
32 console.log(gg); X – 참조불가

 

참고로 재할당이 필요없는 상수와 객체에는 기본적으로 const를 사용하는 것이 좋다.

의도치 않은 재할당을 방지해주기 때문에 안전한 방법이다. 

반대로 재할당이 필요한 경우에는 한정적으로 let을 사용하는 것이 좋다.

단, 이때 변수의 scope는 최대한 좁게 만드는 것이 좋다.

 

 

 

typeof 함수

 

자바스크립트는 선언 시 변수의 자료형을

지정하지 않고 선언하며, 값에 따라 자료형이 지정된다.

해당 변수의 자료형을 확인하려면 typeof(변수명) 으로 확인할 수 있다.

 

자료형에 따라 메소드와 연산자를 활용해서 처리하는 방법이 다르기

때문에 해당 변수의 자료형을 파악해야 할 때 typeof함수가 유용하게 쓰일 수 있다.

var a = 30;  
// console.log –> 30 
// typeof(a) –> number

var b = “kkk”; 
// console.log –> kkk 
// typeof(b) –> String