Javascript: 스코프

스코프는 변수나 함수에 접근할 수 있는 범위를 정의하는 개념으로 변수나 함수가 유효한 범위를 의미한다. 변수가 선언된 위치에 따라 결정되며, 전역 스코프(global scope)와 지역 스코프(local scope)가 있다.

전역 스코프(global scope)

어디에서나 접근할 수 있는 범위를 말하며 전역 스코프에 선언된 변수는 프로그램 전체에서 접근할 수 있다.

// 전역 스코프의 변수
let globalVar = 10;

function testFunction() {
    console.log(globalVar); // 10
}

testFunction(); // testFunction 함수에서 전역 변수에 접근 가능
console.log(globalVar); // 10

지역 스코프(local scope)

지역 스코프는 코드 블록 내에서 유효한 범위이다. 함수 내부에서 선언된 변수는 함수 내에서만 접근 가능하다.

function localScopeExample() {
    // 지역 스코프의 변수
    let localVar = 20;
    console.log(localVar); // 20
}

localScopeExample();
console.log(localVar); // ReferenceError: localVar is not defined

let과 const의 블록스코프

let과 const는 모두 블록스코프(block scope)를 가지며, 이는 변수의 범위가 가장 가까운 중괄호 내에서만 유효한 것을 의미한다. 이러한 블록 스코프는 변수를 특정 코드 블록 내에 한정시켜 변수의 범위를 제한함으로써 의도하지 않은 변수 재사용을 방지한다.

var는 변수가 선언된 함수 내에서만 유효한 함수 스코프를 가지고 있다.

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

function letExample() {
    if (true) {
        let y = 20;
    }
    console.log(y); // ReferenceError: y is not defined
}

varExample();
letExample();

스코프 체인(scope chain)

중첩된 함수 또는 블록이 있는 경우, 스코프가 계층적으로 구성된다. 함수 내부에서 외부 함수의 변수에 접근할 수 있지만 외부에서 내부 함수의 변수에 접근할 수 없다.

let outerVar = 30;

function outerFunction() {
    let innerVar = 40;

    function innerFunction() {
        console.log(outerVar); // 30
        console.log(innerVar); // 40
    }

    innerFunction();
    console.log(innerVar); // 40
}

outerFunction();
console.log(outerVar); // 30
console.log(innerVar); // ReferenceError: innerVar is not defined