javascript - 유효범위 (전역변수, 지역변수)

Front-End/javascript 2019. 6. 11. 23:49
728x90
반응형

-유효범위-

 

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

 

 

 

-전역변수와 지역변수-


(c언어나 java에서의 의미와 동일)

 

 



  
  전역변수


  함수 바깥쪽에 선언되어서 모든 함수에서 접근이 가능한 변수


  지역변수


  함수 안쪽에 선언되어서 그 함수내에서만 사용할 수 있는 변수

 

 



  
  참고


  함수 안쪽에서 변수 앞에 var(데이터타입) 이 붙으면 함수 안쪽에 있으면 지역변수, 함수 바깥쪽에 있으면 전역변수이다.
 

 

 

-예제-

1
2
3
4
5
6
var a = 'korea';
function f(){
a = 'corea'; //여기서 a는 전역변수인 a를 가리키고 전역변수의 값을 'corea'로 변경
}
f();
alert(a); //위에서 바꾼 a의 값인 'corea'가 출력
cs

 

1
2
3
4
5
6
var a = 'korea';
function f(){
var a = 'corea'; //여기서 a는 지역변수이다.
}
f();
alert(a); //지역변수는 함수내에서만 사용할 수 있고, 전역변수가 선언되어있기 때문에 전역변수 a의 값인 'korea'가 출력
cs

 

 

전역변수의 사용

 

불가피하게 전역변수를 사용해야 하는 경우는 하나의 객체를 전역변수로 만들고 객체의 속성으로 변수를 관리하는 방법을 사용

 

 

-예제-

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function(){
    var MYAPP = {} //객체를 생성
    MYAPP.calculator = { //객체 안에 들어있는 속성(객체안에 있는 변수) calculator에 객체를 생성하고 left와 right 값을 null로 선언
        'left' : null,
        'right' : null
    }
    MYAPP.coordinate = { //객체 안에 들어있는 속성(객체안에 있는 변수) corrdinate에 객체를 생성하고 left와 right 값을 null로 선언
        'left' : null,
        'right' : null
    }
    MYAPP.calculator.left =  10; //calculator의 left값을 10으로 설정
    MYAPP.calculator.right = 20; //calculator의 right값을 20으로 설정
    function sum(){
        return MYAPP.calculator.left + MYAPP.calculator.right; //10과 20을 더한값 30을 sum에 리턴
    }
    document.write(sum()); //30이 출력됨
}
cs

 

요약 : 위 예제는 전역변수를 함수안에 집어넣고, 전역변수의 객체를 생성해 그 객체안에 새로운 변수를 만들어서 사용하는 예제

 

 

 

-유효범위의 대상 (함수)-

 

자바스크립트는 함수에 대한 유효범위만을 제공한다.

많은 언어들이 블록 (대체로{ }) 에 대한 유효범위를 제공하는 것과는 다른 점이다.

(즉, 자바에서는 for문 안에서 변수가 선언된것도 지역변수라고 하는데, 

자바스크립트에서는 오직 함수내에서만 선언된 변수를 지역변수라고 한다. (for문,while문 등은 포함하지 않는다))

 

 

 

-정적 유효범위-

 

자바스크립트는 함수가 선언된 시점에서의 유효범위를 갖는다.

이러한 유효범위의 방식을 정적 유효범위 (static scoping), 혹은 렉시컬 (lexical scoping)이라고 한다.

 

 

-예제-

1
2
3
4
5
6
7
8
9
10
11
var i = 5;
function a(){
    var i = 10;
    b();
}
 
function b(){
    document.write(i);
}
 
a();
cs

 

출력값은 전역변수인 i가 출력이 되서 5가 출력된다.

왜냐하면 사용될때가 아니고 정의될때의 전역변수가 사용이 되기때문에 함수 a에 있는 지역변수인 i가 아니라 함수 바깥쪽에 있는 전역변수인 i가 출력이 되는 것이다. 

이런범위를 정적 유효범위라 한다.

아래 책은 제가 공부할때 활용했던 책으로 추천드리는 책이니 한번씩 읽어보시는것을 추천드립니다!! ㅎㅎ

토비의 스프링 3.1 세트:스프링의 이해와 원리 + 스프링의 기술과, 에이콘출판

이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

728x90
반응형

'Front-End > javascript' 카테고리의 다른 글

null 체크 함수 (공통함수)  (8) 2020.11.11
javascript - 함수와 콜백  (0) 2019.06.12
javascript - 정규표현식  (0) 2019.06.11
javascript - UI와 API  (0) 2019.06.10
javascript - 라이브러리 (jQuery)  (0) 2019.06.09
: