자바스크립트에서 변수 스코프(Scope)란 변수에 접근할 수 있는 유효 범위를 말합니다. 이는 변수가 선언된 위치에 따라 달라질 수 있으며, 이는 코드의 동작을 이해하고 예측하는 데 중요한 역할을 합니다.

전역 스코프(Global Scope)

전역 스코프는 프로그램 전체에서 접근할 수 있는 범위를 가지고 있습니다. 전역 스코프에 선언된 변수는 프로그램 어디서든 참조할 수 있습니다. 하지만 전역 스코프의 남발은 코드 유지보수를 어렵게 만들 수 있기 때문에 사용을 지양해야 합니다.

var globalVar = 'I am in global scope';

function foo() {
  console.log(globalVar); // 'I am in global scope' 출력
}

foo();

지역 스코프(Local Scope)

지역 스코프는 함수 내부에서 선언된 변수의 범위를 말합니다. 함수 내에서 선언된 변수는 해당 함수 내에서만 접근 가능합니다.

function bar() {
  var localVar = 'I am in local scope';
  console.log(localVar); // 'I am in local scope' 출력
}

console.log(localVar); // 에러: localVar는 함수 바깥에서 접근할 수 없음

블록 스코프(Block Scope)

ES6부터 도입된 let과 const 키워드는 블록 스코프를 가집니다. 블록 스코프는 중괄호({})로 둘러싸인 영역 내에서만 접근할 수 있는 범위를 의미합니다.

if (true) {
  let blockVar = 'I am in block scope';
  console.log(blockVar); // 'I am in block scope' 출력
}

console.log(blockVar); // 에러: blockVar는 블록 바깥에서 접근할 수 없음

클로저(Closure)

클로저는 내부 함수가 외부 함수의 지역 변수에 접근할 수 있는 메커니즘을 말합니다. 이를 통해 외부 함수의 변수를 다룰 수 있고, private 변수를 생성할 수 있습니다.

function outer() {
  var outerVar = 'I am in outer scope';

  function inner() {
    console.log(outerVar); // 'I am in outer scope' 출력
  }

  return inner;
}

var closureFunc = outer();
closureFunc();

자바스크립트의 변수 스코프와 유효 범위에 대한 이해는 코드 작성 및 디버깅 시 매우 중요합니다. 적절한 스코프를 유지하고 변수에 대한 접근을 제한함으로써 안정적이고 확장 가능한 코드를 작성할 수 있습니다.