[JavaScript] ES6, 변수 총 정리 ( var, let, const)

 

 

ES6 문법에선 변수 선언 방법이 3가지가 있다. var, let, const 라는 3가지 인데  각각 쓰임과 특징이 다르다. 그 특징을 정리해보려고 한다. 

 

1. 선언
2. 할당
3. 범위

 

 

📑 1. 선언

 

var는 재선언이 가능하다. let과 const는 재선언이 불가능하다. 즉) 이미 있는 변수명을 또 다시 선언하려고 하면 에러가 나는 것. 

 

    var 이름 = 'kim'; //재선언 o, 재할당 o, 범위 function
    var 이름 = 'park'; //위와 같이 var 이름을 중복해서 재선언이 가능하다. 


   //이처럼 let, const는 재선언이 안 된다.  
	let 나이 = 20;
    let 나이 = 30;

 

 

 

 

📑 2. 할당

 

var과 let은 재할당이 가능하다. 즉) 위에서 선언한 값을 변경하려고 할 때 변경 가능하다. 그러나 const는 변경 불가능 즉) 자바에서 상수라고 생각하면 이해하기 쉬울 것 같다. 

 

var 이름2 = 'kim';
이름 = 'park'; //재할당, var과 let은 재할당이 가능하다. 



//const는 재할당 불가능 
const 나이1 = 20;
나이1 = 30;
console.log(나이1);

 

 

이미 선언한 const 변수에 새로운 값을 할당했을 때 발생하는 에러.

 

그럼 Object 내에서 const 변수를 생성했을 때 이 값도 재할당 불가능할까? 이것은 아니다. 이는 값을 재할당 하는 게 아닌 변수의 값을 변경하는 것! 

 

const 사람 = {
    이름 : 'kim'
}

Object.freeze(사람);

사람.이름 = 'park'; //변수 자체에 재할당하는 게 아니라 오브젝트 내부 값을 변경하는 것.

 

만약 값을 변경하지 못하게 하려면 .freeze()라는 함수를 사용하면 된다. 

 

 

 

📑 3. 함수 범위

 

 

var의 범위는 함수 내이며, let과 const는 { } 중괄호 안에서만 생존한다. 

 

function 함수(){
    //var는 function 내에서만 존재함 
    //함수 밖에서는 호출할 수 없음. 
    var 이름 = 'kim';

}

if(ture){
    //let, const는 범위는 모든 중괄호 
    //function보다 더 작은 모든 중괄호 안에서 살고 죽는다. 
    let 이름 = 'kim';
}

 

 

 

위와 같은 특징들을 정리하면 다음과 같다. !! 

 

	재선언	재할당	범위
var	o	o	function
let	x	o	{ } 중괄호
const	x	x	{ } 중괄호