[ javascript 코딩 ] Variable scope

안녕하세요. 제임스 입니다. 

앞서 변수 선언에 대해 포스팅을 했는데요. 일반적으로 variable scope 라고 부르는 변수 영역이라는 것이 있습니다. 

변수 영역이라 부르니 어렵죠? 변수가 선언되어 사용될 수 있는 영역이라고 생각 하시면 됩니다. 

일반적으로 변수는 Global Variable 과 Local Variable 두가지 종류로 분류되고 있습니다. 

▶ 함수 (function) 외부에서 선언되면 Global Variable 

▶ 함수 내부에서 선언되면 해당 함수 내에서만 사용 되므로 Local Variable

<script>
    
    var a = 3;
    
    function localVariableFunction(){
        var b = 5; 
    }
    
    console.log(a);
    console.log(b);
 
</script>

변수 a 는 함수 밖에서 선언 되어 있습니다. Global 변수입니다. 

변수 b 는 함수 안에서 선언 되었습니다. Local 변수 입니다. 

글로벌 변수와 달리 로컬 변수는 지정된 영역안에서만 사용 가능 합니다. 이를 Variable Scope 이라고 부릅니다. 

즉, 변수 a 는 글로벌 변수 이므로 함수 안이든 밖이든 상관 없이 사용 가능하지만 변수 b 는 선언된 함수 내에서만 사용 가능합니다. 

위 코드를 실행 시켰을때 a 값은 정상적으로 로그가 찍히겠지만 b 값은 변수 밖에서 호출 하였으므로 오류가 발생하게 됩니다. 

function localVariableFunction(){
    var b = 5;
    console.log(b);
}

만약 위와 같이 함수 안에서 호출 한다면 당연히 원하는 값을 보실 수 있습니다. 

함수 내부에서 선언된 경우만 Local Variable 로 판정 되는 것은 아닙니다. 

if(true){
    var x = 10;
}
console.log(x);

위 코드를 실행 할 경우 어떤 결과가 나올까요? 

if 절 안에서 변수 선언을 했지만 true 상태이므로 if 절 안 코드를 실행 시키게 됩니다. 즉, Global 함수 선언과 동일하다고 생각 하시면 됩니다. 

위 코드를 실행 하면 결과 값은 10 이 리턴 됩니다. 

if(false){
    var y = 10;
}
console.log(y);

이번에는 if 절 조건이 false 입니다. 즉, if 절 내부 코드가 읽혀 지지 않습니다. 

프로그램상으로 봤을때 변수 y 가 선언되지 않았습니다. 

위 코드를 실행하면 결과는 undefined 가 리턴 됩니다. 

variable scope 상으로 봤을때 위 코드이 변수 y 는 로컬 변수와 같은 역할이 되었습니다. 

▼ 도움이 되셨다면 로그인이 필요 없는 ▼

▼ 하트 클릭 한번 부탁 드립니다 ▼

감사합니다 :D