JavaScript 변수 선언 var let const 차이와 사용법 예제(+템플릿 리터럴)

자바스크립트는 ES6 부터 변수 선언할때 var 외에 let, const가 추가되었습니다.

 

스코프는 변수의 유효범위와 연관 있습니다.

여기서 변수의 유효범위란 해당 변수를 사용할수 있는 범위입니다.

 

---

[함수 스코프 : 유효범위가 함수 내부] : var 

 

 -> var 는 함수 스코프 가능 블록 스코프 불가능

/*  함수 스코프 */

fnEx();

function fnEx(){
	var a = 5;
    console.log(a);	//5 출력
}

console.log(a); // 오류

함수 스코프 가능한 var 변수는 함수 밖에서는 사용 불가능합니다.

 

/*  블록 스코프 */

var a = 3;

{
	var a = 5;
    console.log(a);	// 5출력
}

console.log(a); // 5출력

블록 스코프가 불가능한 var 변수는 위 소스 마지막 줄에서 3이 아닌 5가 출력됩니다.

---

[블록 스코프 : 유효범위가 블록( = {} ) 내부] : let , const 

let , const는 둘 다 블록 스코프가 가능합니다.

/* let 사용법 */

let a; // 변수 선언 
let a = 1; //변수 선언과 동시에 값 할당

/* const 사용법 */

const a = 5; //변수 선언과 동시에 값 할당 필수
			 //변수 값 재할당 불가능

let 선언 변수는 변경 가능, const 선언 변수는 불변입니다.

 

/* 블록 스코프 */

{
	let a=3;
    const b=5;
    
    console.log(a);	//3출력
    console.log(b); //5출력
    
    b=3 //값 변경 불가능
}

console.log(a);	//오류
console.log(b); //오류

let, const 변수는 블록({}) 밖에서 사용하지 못하기때문에 맨 밑 출력은 실행되지 않는다.

---

[템플릿 리터럴] : ES6 스타일

console.log('첫번째 '+a+' 두번째 '+b);	//이전버전
console.log('첫번째 ${a} 두번째 ${b}');	//es6버전