본문 바로가기

JavaScript

[JavaScrirpt] 유효범위

#함수 : 모듈화의 근간

#유효범위(scope) : 변수의 수명


지역(local)변수 : 함수 내에서 변수를 선언한 것, {} 안쪽.

전역(global)변수 : 함수 밖에서 변수를 선언한 것.

*전역변수보다 지역변수를 사용하자!

1
2
3
4
5
6
7
8
9
10
11
12
var vscope = 'global';
function fscope(){    
    alert(vscope);
}
fscope(); //global 출력
 
var vscope = 'global';
function fscope(){ 
    var vscope = 'local';   
    alert(vscope);
}
fscope(); //local 출력
cs


# 유효범위의 효용

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function a (){
    var i = 0;
}
for(var i = 0; i < 5; i++){
    a();    
document.write(i);
}
//실행결과 01234
 
function a (){
    var i = 0;
}
for(var i = 0; i < 5; i++){
    a();    //a가 실행될때마다 i가 0으로 초기화, 심각한 오류
document.write(i);
}
cs


# 전역변수의 사용

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
var MYAPP = {} //하나의 객체를 전역변수로 만들기
MYAPP.calculator = {
    'left' : null//null: 값을 아직 지정하지 않음
    'right' : null //객체의 속성으로 변수를 관리한다
}
MYAPP.coordinate = {
    'left' : null,
    'right' : null
}
 
MYAPP.calculator.left = 10;
MYAPP.calculator.right = 20;
function sum(){
    return MYAPP.calculator.left + MYAPP.calculator.right;
}
document.write(sum());
 
 
//익명함수 : 전역변수가 전혀 존재하지 않음
(function(){
    var MYAPP = {} // 함수안의 지역변수 MYAPP
    MYAPP.calculator = {
        'left' : null,
        'right' : null
    }
    MYAPP.coordinate = {
        'left' : null,
        'right' : null
    }
    MYAPP.calculator.left = 10;
    MYAPP.calculator.right = 20;
    function sum(){
        return MYAPP.calculator.left + MYAPP.calculator.right;
    }
    document.write(sum());
}())
 
cs



#유효범위의 대상 : 자바스크립트의 지역변수는 함수에서만 유효하다.


#정적 유효범위

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var i = 5// 전역변수
 
function a(){
    var i = 10// 지역변수 i
    b();
}
 
function b(){
    document.write(i); // i가 누구인가?
    // i는 b 함수 내에서 지역변수 i를 찾다가
    // 없으니, 전역변수 i를 찾는다.
    // 정의될 때의 전역변수가 사용됨. : 정적 유효범위라고 한다. Lexical scoping
}
 
a(); // 5가 호출된다
cs




'JavaScript' 카테고리의 다른 글

[JavaScript] 정규표현식  (0) 2015.11.20