[ ES6 Script ] Block scope 와 var VS let

- Block-scope 

• Block-scope: {}로 감싸진 유효 범위
• 기존의 var는 function scope레벨 hoisting
• let 키워드를 사용해 변수의 유효범위를 블록 스코프 처리

 

 

1. Scope

 

변수의 유효범위 입니다.

 

var 의 변수 유효범위

 

블록 스코프가 아닌 function 스코프입니다.

 

 

var num = 1;
function printNum(){
  console.log(num);
  var num = 2;
  console.log(num);
};
printNum(); //2

 

 

 

 

function 레벨에서 호이스팅이 발생하고 있는 것을 확인할 수 있습니다.

 

호이스팅: https://nevertrustbrutus.tistory.com/335

 

 

 

 

아래는 함수가아닌 블록일 경우의 예제입니다.

 

var test = '1';
if(true){
	var test = '2';
    console.log(test);
};
console.log(test);

 

 

 

"2" 가 두 번 출력됩니다.

 

1번라인의 "test"는 전역스코프이고 

3번라인의 "test"는 지역 스코프에 선언된 변수입니다.

 

지역 스코프에 선언된 test 가 hoisting 되어 전역 스코프에 선언된 test 값을 변경된것입니다.

 

 

 

 

- let 선언자

 

 let 선언자를 사용하면 위의 문제를 해결할수있습니다.

 

var test = '1';
if(true){
	var test = '2';
    console.log(test);
};
console.log(test);

 

let 키워드를 사용했기 때문에 전역 스코프와 블록 스코프를 구별할 수 있습니다.