[JS] 스코프(Scope) 이해하기

JavaScript에서 스코프(Scope) 이해하기

스코프(scope)는 프로그래밍에서 중요한 개념 중 하나로, 변수와 함수 등의 식별자가 어디까지 유효한지, 즉 어디서 접근 가능한지를 결정한다. 이번 포스트에서는 JavaScript의 스코프에 대해 알아보겠다.

1. 스코프(Scope)란?

스코프는 변수나 함수의 '생애주기'라고 볼 수 있다. 즉, 어떤 위치에서 식별자에 접근할 수 있는지를 결정하는 범위이다. JavaScript에는 전역 스코프(global scope), 함수 스코프(function scope), 블록 스코프(block scope) 등 여러 종류의 스코프가 있다.

2. 전역 스코프(Global Scope)

전역 스코프에 선언된 변수(전역 변수)는 코드의 어느 곳에서든 접근할 수 있다.

var globalVar = "I am a global variable";

function checkScope() {
    console.log(globalVar); // "I am a global variable"
}

checkScope();
console.log(globalVar); // "I am a global variable"

위 예시에서 globalVar은 전역 변수로서, 함수 내부 및 외부 어디서든 접근이 가능하다.

3. 함수 스코프(Function Scope)

함수 내부에서 선언된 변수는 해당 함수 내부에서만 사용할 수 있으며, 이를 지역 변수(local variable)라고 한다.

function checkScope() {
    var localVar = "I am a local variable";
    console.log(localVar); // "I am a local variable"
}

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

위 예시처럼 localVar은 checkScope 함수 내부에서만 접근이 가능하며, 외부에서는 찾을 수 없어 오류가 발생한다.

4. 블록 스코프(Block Scope)

JavaScript ES6 이상 버전에서 도입된 let과 const 키워드를 사용하여 선언된 변수는 블록({}) 내부에 대해서만 유효하다.

if (true) {
    let blockScopedLet = 'block scoped let';
    const blockScopedConst = 'block scoped const';
    console.log(blockScopedLet); // 'block scoped let'
    console.log(blockScopedConst); // 'block scoped const'
}

console.log(blockScopedLet); // ReferenceError: blockScopedLet is not defined
console.log(blockScopedConst); // ReferenceError: blockScopedConst is not defined

위 예시에서 blockScopedLet과 blockScopedConst는 블록 내부에서만 유효하며, 블록 외부에서는 찾을 수 없어 오류가 발생한다.

5. 스코프 체인(Scope Chain)

JavaScript에서는 현재 스코프에 변수가 없으면, 상위 스코프를 차례로 검색하는데 이를 스코프 체인이라고 합니다. 이 과정은 전역 스코프에 도달할 때까지 반복되며, 만약 전역 스코프까지 검색해도 해당 변수를 찾지 못하면 ReferenceError가 발생한다.

마치며

스코프는 코드의 구조와 흐름을 이해하는데 매우 중요한 요소이다. JavaScript 개발자라면 꼭 알아야 할 기본적인 개념 중 하나이니, 잘 이해하고 활용하여 효율적이고 오류 없는 코드를 작성하는 것이 중요하다.