전역과 지역 스코프

<aside> 💡 Scope란? 범위 라는 뜻을 갖고 있으며 변수에 접근할 수 있는 범위를 뜻함

</aside>

전역 스코프 → 전역에 선언되어 있어 어느 곳에서든지 해당 변수에 접근할 수 있음

지역 스코프 → 해당 지역에서만 접근할 수 있어 지역을 벗어난 곳에선 접근할 수 없음

// 함수 영역 밖의 전역 변수
var x = 'global x';
var y = 'global y';

function outer() {
		// 함수 영역 내부의 지역 변수
    var z = "outer's local z";

    console.log(x);         // global x
    console.log(y);         // global y
    console.log(z);         // outer's local z

    function inner() {
        var x = "inner's local x";

        console.log(x);    // inner's local x
        console.log(y);    // global y
        console.log(z);    // outer's local z
    }

    inner();
}

outer();

스코프 체인

전역 스코프 ← outer 지역 스코프 ← inner 지역 스코프

모든 스코프는 하나의 계층적 구조로 연결되며, 모든 지역 스코프의 최상위 스코프는 전역 스코프

변수를 참조할 때 자바스크립트 엔진은 스코프 체인을 통해 변수를 참조하는 코드의 스코프에서 시작하여 상위 스코프 방향으로 이동하며 선언된 변수를 검색함

따라서, 상위 스코프에서 유효한 변수는 하위 스코프에서 자유롭게 참조할 수 있지만 하위 스코프에서 유효한 변수는 상위 스코프에서는 참조할 수 없음

• 즉, 지역 스코프에서 전역 스코프를 접근할 수 있지만 반대로 전역 스코프에서 지역 스코프로 접근 할 수 없음

함수 레벨 스코프

C, 자바 등 대부분의 프로그래밍 언어는 함수 몸체만이 아니라 **모든 코드 블록(if, for, while, try/cath 등)이 지역 스코프를 만드는 블록 레벨 스코프(block level scope)**를 가진다.

하지만 **var 키워드로 선언된 변수는 오직 함수의 코드 블록(함수 몸체)만을 지역 스코프로 인정하는 함수 레벨 스코프(function level scope)**를 가진다.