ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • Effective JavaScript [8] - 전역객체의 사용을 최소화하라
    Javascript 2016. 12. 2. 00:04



    본 게시물은 Effective Javascript의 내용을 재구성하여 작성되었음을 알립니다. 저작권 문제 발생시 게시물이 비공개 될 수 있습니다. 



    - 전역 변수를 선언하지 마라

    - 가능하면 변수를 지역적으로 선언하라
    - 전역 객체에 프로퍼터를 추가하지 마라.

    - 플랫폼의 기능 탐지를 위해 전역 객체를 사용하라.





    자바스크립트에서 전역 변수를 정의하는 것은 모든 사람이 공유하는 공통의 네임스페이스를 더럽히고 뜻하지 않게 이름을 충돌할 만한 가능성을 만든다. 실제로 전역 네임스페이스는 자바스크립트 프로그램의 구분된 요소들이 상호작용할 수 있는 유일한 방법이기 때문에, 전역 변수의 사용은 불가피하다. 라이브러리나 컴포넌트 에서 전역 변수 이름을 정의하는 경우가 아니라면 가능한 모든 변수를 지역변수로 유지하는 게 최선이다. 


    var i, n, sum;    // 전역


    function averageScore(players) {

        sum = 0;

        for ( i = 0, n = players.length; i < n; i++ ) {

            sum += score(players[i]);

        }

        return sum / n;

    }


    averageScore 가 의존하고 있는 score 함수에서 다른 목적으로 동일한 이름의 전역 변수를 사용한다면 이 함수 정의는 제대로 동작하지 않을 것이다. 



    var i, n, sum;    // 전역


    function score(players) {
        sum = 0;
        for ( i = 0, n = players.levels,length; i < n; i++ ) {
            sum += player.levels[i].score;
        }
        return sum ;

    }



    이런 변수들은, 이를 사용하는 코드 내에 지역변수로 유지하는 것이다.


    function averageScore ( players ) {

        var i, n, sum;

        sum = 0;

        for ( i = 0, n = players.length; i < n; i++ ) {

            sum += score(players[i]);

        }

        return sum / n;

    }


    function score(players) {
        var i, n, sum; 
        sum = 0;
        for ( i = 0, n = players.levels,length; i < n; i++ ) {
            sum += player.levels[i].score;
        }
        return sum ;
    }


    자바스크립트의 전역 네임스페이스는 전역 객체로도 노출되어 있다. 이 전역 객체는 프로그램의 최상단에서 this 키워드로 접근할 수 있다. 웹 브라우저에서는 전역 객체가 전역 window 변수에도 바인딩되어 있다. 전역 변수를 추가하거나 수정하면 자동으로 전역 객체가 갱신된다.


    this.foo;    // undefined

    foo = "global foo";

    this.foo;    // "global foo"


    유사하게, 전역 객체를 갱신하면 자동으로 전역 네임스페이스가 갱신된다. 


    var foo = "global foo";

    this.foo = "changed";

    foo;    // "changed"


    전역 변수를 생성하기 위해 두 매커니즘 중 하나를 선택할 수 있다는 뜻이다. 전역 스코프에서 var로 정의하거나, 전역 객체에 추가하면 된다. 두가지 방법 모두 동작하지만, var 선언문이 더 명백하게 프로그램의 스코프에 영향을 준다는 이점이 있다. 


    var 문을 사용하면 바인딩 되지 않은 변수를 참조할 때 런타임 오류를 발생시키고, 스코프를 깨끗하고 간단하게 만들며, 어떤 전역변수를 선언했는지 사용자가 이해하기 쉽다. 


    전역 객체의 특별한 필수적인 사용법에는 실행 환경에 대한 질의를 위해 사용할 수 있다. 예를 들어 ES5에는 JSON 데이터 형식을 읽고 쓰기 위한 새로운 전역 JSON 객체를 제공한다. JSON 객체를 제공하거나 혹은 아직 제공하지 않은 실행환경에 임시 방편으로 코드를 배포하기 위해, 해당 객체의 존재 여부를 전역 객체에서 확인하고 대체제로 사용할 수 있는 구현체를 제공할 수 있다.


    if ( ! this.JSON ) {

        this.JSON = {

            parse: ..., 

            stringify: ...

        }

    }


    기능 탐지 기술은 웹브라우저에서 특히 중요하다. 엄청나게 다양한 브라우저들과 브라우저 버전에서 동일한 코드가 실행될 수 있기 때문이다. 기능 탐지는 다양한 플랫폼의 기능 모음들을 사용해 프로그램을 견고하게 만드는 비교적 쉬운 방법이다. 또한 브라우저나 자바스크립트 서버 환경 두 군데에서 모두 동작할 수 있는 라이브러리를 공유할 때에도 적용할 수 있다. 


    - 전역 변수를 선언하지 마라.

    - 가능하면 변수를 지역적으로 선언하라.

    - 전역 객체에 프로퍼터를 추가하지 마라.

    - 플랫폼의 기능 탐지를 위해 전역 객체를 사용하라.



    끄읕.



Designed by Tistory.