[JS] Javascript Closure에 대해서

클로저(Closure)는 자바스크립트의 중요한 개념 중 하나로, 함수와 그 함수가 선언된 렉시컬 스코프에 접근할 수 있는 메커니즘을 의미합니다. 이는 간단한 함수에서부터 강력하고 유용한 디자인 패턴을 만들 때까지 다양한 상황에서 사용됩니다.

1. 클로저의 기본 구조

function outerFunction() {
  let outerVariable = 'I am outer!';

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

  return innerFunction;
}

const closureExample = outerFunction();
closureExample(); // 출력: I am outer!

outerFunction은 innerFunction을 반환하고 있습니다. 이때 innerFunction은 외부 함수의 변수 outerVariable에 접근할 수 있습니다. 반환된 closureExample을 호출하면, 클로저는 외부 함수의 변수에 여전히 접근할 수 있습니다.

2. 클로저 활용 예시

function counter() {
  let count = 0;

  return function () {
    count++;
    console.log(count);
  };
}

const counterFunction = counter();
counterFunction(); // 출력: 1
counterFunction(); // 출력: 2

위 예시에서 counter 함수는 클로저를 사용하여 내부 함수를 반환하고 있습니다. 이 클로저를 통해 count 변수는 외부에서 접근되지 않으면서도 계속해서 유지됩니다.

3. 메모리 관리 측면

클로저를 사용할 때 주의해야 할 점은 메모리 누수입니다. 클로저는 외부 함수의 변수에 대한 참조를 유지하기 때문에, 필요하지 않은 경우에는 해당 참조를 해제하여 메모리 누수를 방지해야 합니다.

클로저는 함수형 프로그래밍과 이벤트 핸들링 등 다양한 상황에서 유용하게 사용되는 강력한 자바스크립트 기능 중 하나입니다. 이를 이해하고 적절히 활용하면 보다 효율적이고 간결한 코드를 작성할 수 있습니다.