자바스크립트 유효범위: 전역변수와 지역변수

유효범위(Scope)는 변수의 수명을 의미합니다.

var vscope = 'global';

function fscope(){

    alert(vscope); //global을 출력

}

fscope();

fscope함수는 함수 바깥에 선언된 vscope에 접근할 수 있습니다.

var vscope = 'global';                                        var vscope = 'global';

function fscope(){                                                        function fscope(){

    var vscope = 'local';                                       vscope = 'local';

    alert('함수안 '+vscope); //local을 출력                alert('함수안 '+vscope); //local을 출력

}                                                                  }

fscope();                                                         fscope();

alert('함수밖 '+vscope); //global을 출력                alert('함수밖 '+vscope); //local을 출력

var vscope = 'global';

function fscope(){

var vscope = 'local' //지역변수에 해당

 vscope = ‘local’ //역시 지역변수에 해당

}

fscope();

alert(vscope); //global을 출력

이미 var으로 vscope의 지역변수가 생성되었습니다.

전역변수는 사용하지 않는 것이 좋습니다. 여러가지 이유로 그 값이 변경될 수 있기 때문입니다.함수 안에서 전역변수를 사용하고 있는데, 누군가에 의해서 전역변수의 값이 달라졌다면 어떻게 될까요? 함수의 동작도 달라지게 됩니다. 이는 버그의 원인이 됩니다. 또한 함수를 다른 애플리케이션에 이식하는데도 어려움을 초래합니다. 변수를 선언할 때는 꼭 var을 붙이는 것을 습관화해야 합니다. 전역변수를 사용해야 하는 경우라면 그것을 사용하는 이유를 명확히 알고 사용해야합니다.

전역변수를 사용하는 법

MYAPP = {}                                         (function(){

MYAPP.calculator = {                                       var MYAPP = {}

    'left' : null,                                                MYAPP.calculator = {

    'right' : null                                               'left' : null,

}                                                                  'right' : null

MYAPP.coordinate = {                                       }

    'left' : null,                                                MYAPP.coordinate = {

    'right' : null                                                          'left' : null,

}                                                                             'right' : null

MYAPP.calculator.left = 10;                                            }

MYAPP.calculator.right = 20;                               MYAPP.calculator.left = 10;

function sum(){                                                MYAPP.calculator.right = 20;

    return MYAPP.calculator.left + MYAPP.calculator.right;     

function sum(){

}                                                                   return MYAPP.calculator.left + MYAPP.calculator.right;

document.write(sum());                                   }

                                                                document.write(sum());

                                                        }())

오른쪽 코드처럼 함수로 감싸주어 바로 호출할 수 있습니다. = 익명함수

Var MYAPP은 function()내에 있기 때문에 지역변수입니다.

이러한 코드는 자바스크립트에서 로직을 모듈화하는 일반적인 방법입니다.

자바스크립트 유효범위의 대상(함수)

for(var i = 0; i < 1; i++){                         for(int i = 0; i < 10; i++){

 var name = 'coding everybody';               String name = "egoing"; //name은 지역변수

}                                                       }

alert(name);                                         System.out.println(name); //에러가 납니다.

*함수의 중괄호 안에 선언된 변수만이 함수 안의 지역변수이므로 for, if 중괄호에 선언된 함수는 지역변수로의 의미를 가지 않습니다.

자바스크립트 정적 유효 범위

var i = 5; //전역 변수

function a(){

    var i = 10; //지역 변수

    b();

}

function b(){

    document.write(i); //b함수 내에 i라는 변수가 존재하지 않기 때문에 전역 변수를 찾게 된다.

}                         //사용될 때가 아니라 정의될 때의 전역 변수가 사용됩니다. 이를 정적

//유효범위 또는 렉시컬이라고 부릅니다.

a(); //실행 결과는 5

출처 : 생활코딩 강의