본문 바로가기

Programming/과거포스팅

자바스크립트 Hoisting 끌어올림

요즘 자바스크립트 완벽가이드 6판을 보는중에 재미있는 부분을 발견했다..

바로 JavaScript Hoisting인데 말그대로 함수 내부에 선언된 변수의 끌어올림에 관한 문법이다..


    function hoist() {
        
        var i = 0;
        
        if(i == 0) {
            var j = 0;
            
            for(var  k=0; k < 10; k++) {  //k는 for문의 지역변수이지만...
                console.log(k);
            }
            console.log(k);  이부분은 정상적인 값(10)이 출력이 된다..
        }
        console.log(j);
    }


    hoist();
 

자바스크립트에서 함수 내부에서 선언된 변수는 함수 전체에 걸쳐서 유효하다는 문법이다.. 

이것은 공식적인 명칭은 아니고 비공식적으로 Hoisting이라고 부르고 있다.

그럼 조금 다른 예를 보자.
 
 
   var scope = "test";
    function hoist() {
        console.log(scope);          보통 이부분에선 지역변수가 선언되기 이전이므로 전역변수가 출력된다고 생각하겠지만 undefined를 출력한다.
        var scope = "initialization";
        console.log(scope);          여기에선 초기화 된 값이 출력된다.
    }
host(); 

위의 문장으로 알수 있다.

함수 내에 선언된 지역변수는 모두 함수의 가장위로 끌어 올림이 된것처럼 동작한다...

하지만 정상적인 값이 출력되는 것은 변수가 초기화 되고 난 이후이다. 

자바스크립트는 너무나 자유로운 만큼 재밌는 놈인거 같다... ㅎㅎ