클로저(Closeure)

클로저는 함수 내부에서 함수를 정의하고, 내부 함수에서 외부 함수의 변수에 접근할 수 있는 개념이다.

 

function outerFunction() {
  const outerVar = 10;
  
  function innerFunction() {
    const innerVar = 5;
    return outerVar + innerVar; // innerVar와 outerVar에 접근 가능
  }
  
  return innerFunction;
}

const closureFunc = outerFunction(); // outerFunction이 실행되고 innerFunction이 반환됨
console.log(closureFunc()); // 15를 출력

 

outerFunction 내부에 있는 innerFunction은 외부 함수인 outerFunction의 변수 outerVar에 접근할 수 있다.

 

1. 함수 내부에서 다른 함수를 정의하면, 내부 함수는 외부 함수의 변수에 접근할 수 있다.

2. 내부 함수가 외부 함수를 벗어나더라도, 외부 함수의 변수에 대한 참조가 유지된다.

3. 이러한 내부 함수와 외부 함수의 변수 간의 관계를 클로저라고 한다.

 

이것이 클로저의 핵심이다.

 

클로저 응용 - 카운터 함수

function createCounter() {
  let count = 0; // 외부 함수의 변수

  return function () {
    return ++count; // 외부 함수의 변수에 접근 가능하며, 카운트를 증가시킴
  };
}

const counter = createCounter(); // createCounter 함수 실행 및 내부 함수 반환
console.log(counter()); // 1을 출력
console.log(counter()); // 2를 출력

 

이 예제에서는 createCounter 함수가 외부 함수로, 내부 함수에서 외부 함수의 변수 count에 접근하고 있으며, 각 호출 시 카운트가 증가한다.

count 변수가 함수의 호출이 끝나도 파괴되지 않는 이유는 클로저(Closure)의 작동 원리 때문이다.

클로저는 함수가 반환된 이후에도 해당 함수가 생성된 스코프 내의 변수를 참조하고 유지한다.

클로저를 파괴하려면 해당 클로저를 더 이상 참조하지 않도록 해야 한다.

 

count 변수 파괴 - 변수나 함수에 null 할당

let count = createCounter(); // 클로저 생성
count = null; // 클로저 참조 제거

 

count 변수 파괴 -  클로저를 가리키는 참조를 없애기

const myCounter = createCounter(); // 클로저 생성
const anotherCounter = myCounter; // 클로저를 다른 변수에 할당
myCounter = null; // myCounter 변수의 클로저 참조 제거
// 이제 anotherCounter를 통해 클로저에 접근할 수 없음

 

 

클로저 응용 - 메모이제이션 (Memoization)

function memoize(fn) {
  const cache = {};
  return function (arg) {
    if (arg in cache) {
      return cache[arg];
    } else {
      const result = fn(arg);
      cache[arg] = result;
      return result;
    }
  };
}

const expensiveOperation = memoize(function (n) { 
  console.log("계산 중..."); // 엄청 복잡한 계산식임을 가정 ex)재귀
  return n * 2;
});

console.log(expensiveOperation(5)); // "계산 중..." 출력, 10 반환
console.log(expensiveOperation(5)); // 10 반환 (캐시된 결과 사용)

 

설명

 

1. 함수의 결과를 저장할 캐시(Cache) 객체를 생성

2. 함수가 호출될 때, 함수의 인수를 캐시 키로 사용하여 캐시에서 결과를 찾음

3. 결과가 캐시에 존재하면 저장된 결과를 반환하고, 그렇지 않은 경우 함수를 실행하고 결과를 캐시에 저장한 후 반환

 

이렇게 클로저를 활용하여 중복 계산을 피하고 함수의 결과를 캐시할 수 있다.

 

스코프 (Scope)

- 스코프는 변수가 접근 가능한 범위를 나타낸다.

- 함수 내에서 선언된 변수는 해당 함수의 스코프 내에서만 접근할 수 있으며, 함수 외부에서는 보이지 않는다.

 

변수 생명주기 (Variable Lifecycle)

- 변수는 선언되었을 때 생성되고, 함수가 종료될 때 파괴된다. 그러나 클로저는 이 변수의 생명주기를 연장한다.

 

내부 함수 (Inner Function)

- 클로저는 외부 함수 내에서 내부 함수를 정의하는 경우에 발생한다.

- 내부 함수는 외부 함수의 스코프에 접근할 수 있다.