[JavaScript] 스코프(Scope)란? - 함수 스코프 vs 블록 스코프

 

js에서 변수를 선언할 때 스코프라는 개념이 나온다. 

또한 var를 사용하면 안되는 이유에 대해 공부하면서 

함수스코프와 블록스코프의 차이에 대한 내용이 언급된다. 

 

🧐🧐

 

처음엔 잘 이해되지 않아 시간이 조금 걸렸는데 

알고보니 굉장히 간단한 개념이었다..!

이제는 명확하게 구분할 수 있을 것 같아 정리를 해보았다. 

 

 

 

 

1) 스코프란? 

 

스코프(Scope)는 변수에 접근할 수 있는 범위를 말한다. 

 

 

2) 전역스코프(global)와 지역스코프(local) (전역변수와 지역변수)

 

보통 프로그래밍 언어를 배울 때 변수 선언의 위치에 따라서 전역변수와 지역변수를 구분한다. 

프로그래밍 언어를 한 번이라도 공부해본 사람은 이 개념에 대해서 이미 알고 있을 것이다. 

스코프는 이렇게 크게 전역스코프와 지역스코프로 나뉜다. 

 

3) 함수스코프(Function-Scope)와 블록 스코프(Block-Scope)

 

지역스코프 안에서 함수스코프와 블록스코프로 또 나눌 수 있다. 

이 개념은 JavaScript에서 등장하는 개념으로 JS 공부를 시작한 사람에게 필수 개념이다. 

var와 let,const의 가장 큰 차이이기도 하다. 

 

(ES6가 등장하면서부터 사용하지않는) var에 대한 내용으로 이 개념을 몰라도 개발에 전혀 지장이 없지만, 

면접 질문으로 많이 나오는 질문이기도 하니 가볍게 알고있는게 좋다!

 

 

 

함수스코프란 함수에서 선언한 변수는 해당 함수 내에서만 접근이 가능하다는 것이다. 

블록스코프란 If, for등 블록{  } 내부에서 선언된 변수는 해당 블록에서만 접근이 가능하다는 것이다. 

 

다음 코드를 보면 이해가 쉽다. 

var num = "One";                // 전역변수

function showNum(){
	var num = "Two";          // 지역변수 - var(함수스코프)
    if(true){
    	var num = "Three";      // 지역변수 - var(함수스코프)
        console.log(num);
    }
    console.log(num);
}
showNum();
console.log(num);

결과를 한 번 예상해보자!!

 

 

 

 

 

😗

 

 

 

 

 

 

결과는 다음과 같이 출력된다. 

Three
Three
One

if문 안에 선언된 num은 if 블록 안에 있지만 var로 선언되어 함수스코프이기 때문에

if문 밖 그리고 showNum함수 안에서 영향을 끼친다. 

 

 

 

 

 

 

 

 

여기서 왜 같은 이름의 num 변수가 중복해서 선언되었는가?!가 궁금하다면 

다음 게시물인 "var를 사용하면 안되는 이유" 보기!