[JavaScript 심화 시리즈] 1일차: JavaScript 클로저와 스코프 체인 이해하기

1. 클로저와 스코프 체인

클로저란 무엇인가?

클로저는 함수가 선언될 당시의 렉시컬 스코프(Lexical Scope)를 기억하고, 선언된 이후에도 그 스코프에 접근할 수 있는 기능입니다. 클로저를 사용하면 외부 함수의 변수에 접근할 수 있습니다. 이는 데이터 캡슐화와 같은 다양한 용도로 사용될 수 있습니다.

클로저 예제

function outerFunction() {
  let outerVariable = '나는 외부 변수야';

  function innerFunction() {
    console.log(outerVariable);
  }

  return innerFunction;
}

const myFunction = outerFunction();
myFunction();  // 출력: 나는 외부 변수야

이 예제에서 innerFunction은 outerFunction의 실행 컨텍스트에서 선언되었기 때문에 outerVariable에 접근할 수 있습니다. outerFunction이 실행된 후에도 innerFunction은 outerVariable을 기억하고 있습니다.

스코프 체인이란 무엇인가?

스코프 체인은 함수가 변수를 참조할 때, 해당 변수를 찾기 위해 함수가 포함된 스코프를 순차적으로 검색하는 과정을 의미합니다. JavaScript는 렉시컬 스코프를 사용하기 때문에, 함수가 선언될 때의 스코프를 기준으로 변수 검색이 이루어집니다.

스코프 체인 예제

let globalVar = '나는 전역 변수야';

function outerFunction() {
  let outerVar = '나는 외부 변수야';

  function innerFunction() {
    let innerVar = '나는 내부 변수야';

    console.log(innerVar);    // 출력: 나는 내부 변수야
    console.log(outerVar);    // 출력: 나는 외부 변수야
    console.log(globalVar);   // 출력: 나는 전역 변수야
  }

  innerFunction();
}

outerFunction();

이 예제에서 innerFunction은 innerVar, outerVar, globalVar 순으로 변수를 검색합니다. 스코프 체인은 이와 같은 순서로 변수를 검색하며, 변수가 발견되면 검색을 멈춥니다.

클로저의 활용

클로저는 다양한 활용 방법이 있습니다. 대표적인 예로 데이터 은닉과 함수 팩토리를 들 수 있습니다.

1. 데이터 은닉

function createCounter() {
  let count = 0;

  return function() {
    count++;
    return count;
  };
}

const counter = createCounter();
console.log(counter());  // 출력: 1
console.log(counter());  // 출력: 2
console.log(counter());  // 출력: 3

2. 함수 팩토리

function createGreeting(greeting) {
  return function(name) {
    console.log(greeting + ', ' + name + '!');
  };
}

const sayHello = createGreeting('Hello');
sayHello('Alice');  // 출력: Hello, Alice!
sayHello('Bob');    // 출력: Hello, Bob!

const sayHi = createGreeting('Hi');
sayHi('Charlie');   // 출력: Hi, Charlie!

결론

클로저와 스코프 체인은 JavaScript의 강력한 기능 중 하나로, 함수가 선언될 당시의 스코프를 기억하고 활용할 수 있게 합니다. 이를 이해하고 활용하면 더욱 효율적이고 강력한 코드를 작성할 수 있습니다.

다음 글에서는 this 키워드를 이해하는 방법에 대해 알아보겠습니다.

다음 글에서 만나요!