<javascript> Scope

간단히 말해서

 

자바스크립트에서 스코프란 어떤 변수들에 접근 할 수 있는지를 말한다.

그 종류엔 전역 스코프와 지역 스코프가 있는데 이름도 전역변수와 지역변수가 떠오르는데 의미도 비슷하다고 볼 수 있겠다 . 

 

접근가능한 정도(범위) == 스코프!!

 

    var name = "sanghoon";  // 전역변수

    function sayName(){
        console.log(name);
    }

    console.log(name)  // sanghoon 
    sayName();  // sanghoon

 

전역변수를 선언하면 코드 모든 곳에서 해당변수를 사용 할 수 있다.

 

 

function sayName(){
	var name = "sanghoon";  // 전역변수가 아닌 함수블록내부에 선언
    console.log(name);
}

sayName(); // sanghoon
console.log(name);  // error 함수 블록내에 선언된 변수에 접근 x

함수 내부에서 변수를 선언하면 그 변수는 선언한 변수 내부에서만 접근 가능하다.

 

 

다음은 함수 호이스팅과 스코프의 관계에 대해 알아볼 것이다. 

 

함수는 현재 스코프의 최상단으로 호이스팅이 된다. 단 함수 선언식으로 선언해야지만 가능하다. 

 

   	sayHello(); //hello2
        function sayHello(){  // 함수 선언식!!
        	console.log("hello1");
        }
        function sayHello(){
        	console.log("hello2");
        }
      sayHello(); //hello2
      
      
      ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ
      
      
       sayWorld(); //Error
              var sayWorld = function (){    // 함수 표현식!
              console.log("hello world");
        	}   // 에러 발생!! 정의되기전에 호출을 하였다 >> 호이스팅 되지 않았다 

 

이렇게 두 방식의 행동이 다르기 때문에 사용을 조심해야 한다!!

 

 

 

또 함수는 서로의 스코프에 접근할 수 없다. 

function sanghoon(){
            var first = "Jeong";
        };

 function sungjin(){
            sanghoon();
            console.log(first);  
        };

 sungjin();  // 에러발생!

 

위의 예제는 서로 동등한 관계의 함수이기 때문에 접근이 불가능하다.

하지만 내부함수 외부함수의 관계로 나가게 되면 접근 할 수 있는 방법이 생긴다. 

바로 내부함수는 외부 함수의 변수에 접근이 가능하다!! (외부에서 내부는 XX)

 

function outer() {
 	var outer = "외부함수";
	   function inner(){
 			var inner = "내부함수";
 			console.log(outer); // 외부함수 정상 출력
			}
 console.log(inner); //Error  //내부함수 출력 에러!!
}

동등한 관계에서의 스코프 관계와 내부*외부 함수에서의 스코프 관계는 차이가 있으니 잘 알아두자.