자바스크립트 스코프(scope)

 

scope

 자바스크립트 뿐만 아니라 c/c++ ,java를 포함한 어떤 언어라도 공부해 보신분들이라면 누구나 알고 있을 내용이 있습니다 바로 전역변수/ 지역변수에 대한 내용인데요 java로 지역변수와 전역변수에 대한 내용을 잠깐 다뤄 보자면 

class Ex_variables{
    int global_v;

   void addmethod(int a, int b)
   {
        global_v  =  a  + b;
   } 

} 

 큰 설명없이도 global_v 라는 전역변수 개념과 addmethod 라는 매소드 안에서 쓰이는 a, b에  대한 지역 변수에 대한 개념에 대해서는 다들 알고 있을 것입니다. 또한 static 이라는 키워드를 통해 해당 소스 내에서  어디든 사용할 수 있는 전역변수 설정 또한 가능합니다..

 그런데 자바스크립트에서는 스코프라는 말이 많이 등장합니다 . scope는 우리말로 직역하자변 범위라는 뜻을 가지고 있습니다. 이것을 자바스크립트에서 적용해보자면 스코프는 '변수에 접근할 수 있는 범위 ' 를 의미하게 됩니다 

 자바스크립트에서는 함수를 선언하게 되면 함수를 새롭게 생성할 때 마다 새로운 스코프를 만들어 냅니다 제가 방금 스코프를 설명하기전 지역변수와 전역변수의 예를 다룬 이유는 변수드에 접근할 수 있는 범위를 지정하는 부분에서 이는 유사성을 띄고 있습니다.  변수가 함수 밖에 선언되어 있다면 전역스코프, 함수 내에서 선언이 되었다면 지역 스코프에 해당하게 됩니다. 

 

유독 JS 에서 scope 가 강조되는 이유

지역변수와/전역변수에 대한 정의는 다른 언어들도 모두 가지고 있는 특성입니다 그렇지만 유독 js 를 사용하는 프레임워크 들과 node.js와 같은 분야에서는 scope에 대한 강조가 많습니다 그렇다면 왜 유독 scope가 js에서 강조가 될까요?(다른 분야에서 중요하지 않다는 말이 아닙니다)

  그 이유에 대해 설명을 드리자면 일반 컴파일 언어들과 달리 JS 와 같은 경우 변수명을 중복해서 선언하는 것이 가능하며 타입에 대한 명시가 제대로 이루어 지지 않았다고 한들 별다른 에러를 일으키지 않기 때문입니다. 이것에 대한 내용은 이전 포스팅 내용을 참고 해주시면 됩니다

https://dkkim2318.tistory.com/67

var, const , let

js 개발자 분들이나 입문을 js로 하신 분들이라면 사실 스코프에 대해 크게 헤깔리지 않을 수도 있지만  다른 언어에 익숙해져 있는 개발자 분들이나 입문자들은 스코프에 대한 개념에 어려움을 격을 수 있습니다 . 따라서 자바스크립트에서만 다른 특징들을 3가지 정도 정리해 보겠습니다 

 

자바스크립트 스코프의 특징

1. 블록단위가 아닌 함수 단위의 스코프      

function scopeExam() {  
    var a = 0;
    if (true) {
        var b = 0;
        for (var c = 0; c < 5; c++) {
            console.log("c=" + c);
        }
        console.log("c=" + c);
    }
    console.log("b=" + b);
}
scopeExam();

 예를 들어 이런 코드에 대해서는 어떤 결과를 출력하게 될까요? 일반적으로 다른 언어에서는  c라는 변수가 for 문 이라는 블록 안에서 유효하기 때문에 에러를 발생시켜야 하지만 자바스크립트에서는 같은 구조의 코드더라도 유효볌위(scope) 가 함수 단위 이기 때문에 c는 5를 출력하게 됩니다  이와 같이 b와 같은 경우도 if 블록 밖에 위치하면 0을 출력하게 됩니다.

2. 변수명 중복 선언

var scope = 10;  
function scopeExam(){  
    var scope = 20;
	if(true){
    	var scope = 30;
		console.log("scope = " + scope);
	}
    console.log("scope = " + scope);
}
scopeExam();  
console.log("scope = " + scope);

 여기서는 한 함수 내에서 scope라는 같은 이름을 가진 변수를 스크립트 내에서 중복적으로 선언하였습니다. 다른 언어들과 같은 경우 이럴 경우 에러를 발생시키지만 자바스크립트는 코드상 가장 나중에 값으로 덮어쓰입니다.

3. var 키워드 생략

function scopeExam(){  
    scope = 20;
    console.log("scope = " +scope);
}

function scopeExam2(){  
    console.log("scope = " + scope);
}
scopeExam();  
scopeExam2(); 

 일반적으로 js는 변수명 앞에 var, const, let과 같은 키워드를 붙여 주지만 꼭 이런 키워드를 사용하지 않고도 변수가 선언이 됩니다 이러한 경우 키워드를 생략한 변수는 전체 유효범위를 가지며 전역변수로 선언 됩니다 .