JavaScript) Closure 그는 무엇인가?

클로저(Closure)란?

클로저(Closure)는 JavaScript에서 중요한 개념 중 하나로, 함수와 스코프(scope) 관련된 개념입니다. 클로저는 함수가 자신의 외부 스코프에 접근할 수 있도록 하는 메커니즘으로, JavaScript의 강력한 특성 중 하나입니다. 이 글에서는 클로저의 정의, 사용 예제, 주의사항, 그리고 특이한 측면에 대해 알아보겠습니다.

 

클로저란 무엇인가?

클로저는 함수와 함수가 정의된 스코프 사이의 관계를 나타냅니다. 이 관계는 함수가 외부 스코프의 변수에 접근할 수 있을 때 클로저라고 합니다. 클로저는 아래와 같은 특징을 가집니다.

1. 함수 내부에서 함수 정의: 함수 내부에서 다른 함수를 정의하고 반환하는 경우, 내부 함수는 외부 함수의 스코프에 접근할 수 있습니다.
2. 외부 변수 접근: 클로저는 외부 함수의 변수에 접근할 수 있습니다. 이를 통해 변수의 값이 유지되거나 변경될 수 있습니다.

 

클로저 사용 예제

function outer() {
  const outerVar = "저는 외부 변수입니다.";

  function inner() {
    console.log(outerVar); // outerVar에 접근
  }

  return inner;
}

const closureFunc = outer();
closureFunc(); // "저는 외부 변수입니다." 출력

위의 예제에서 inner 함수는 outer 함수의 스코프에 접근하여 outerVar 변수에 접근할 수 있습니다.

 

클로저 주의사항

1. 메모리 누수: 클로저를 남용하면 메모리 누수가 발생할 수 있으므로 주의해야 합니다. 더 이상 필요하지 않은 클로저를 해제해야 합니다.
2. 변수 변경 주의: 클로저에서 외부 변수를 변경하면 예상치 못한 결과를 초래할 수 있으므로 주의해야 합니다.

 

특이한 클로저 예제

javascriptCopy code
for (var i = 0; i < 5; i++) {
  setTimeout(function () {
    console.log(i); // 5가 다섯 번 출력됨
  }, 1000);
}

위의 코드에서 setTimeout 내부의 함수는 비동기로 실행되며, i 변수가 클로저에 포함됩니다. 따라서 i 변수의 최종 값인 5가 다섯 번 출력됩니다.

 

렉시컬 환경(Lexical Environment)

렉시컬 환경은 JavaScript에서 스코프와 변수 식별자를 관리하는 데 사용되는 중요한 개념입니다. 각 함수나 블록마다 자신만의 렉시컬 환경이 있으며, 이 환경은 해당 스코프에 정의된 변수와 함수에 대한 정보를 담고 있습니다.

 

구성 요소

렉시컬 환경은 다음과 같은 구성 요소로 구성됩니다.

1. 환경 레코드(Environment Record): 실제 변수와 함수의 식별자와 그 값을 저장합니다. 이 부분은 클로저와 관련이 깊습니다.
2. 외부 렉시컬 환경 참조(Outer Lexical Environment Reference): 현재 스코프에서 외부 스코프로 연결됩니다. 이를 통해 스코프 체인(Scope Chain)을 형성하며 클로저의 동작에 영향을 줍니다.

1. 스코프 체인(Scope Chain): JavaScript에서는 각 함수가 정의될 때 자신만의 스코프(유효 범위)를 생성합니다. 함수 내부에서 변수를 찾을 때, 먼저 자신의 스코프에서 변수를 찾고, 없으면 외부 스코프로 이동하여 변수를 찾습니다. 이렇게 스코프 간에 연결된 체인을 스코프 체인이라고 합니다. 스코프 체인을 통해 함수는 외부 스코프의 변수에 접근할 수 있습니다.
2. 클로저(Closure): 클로저는 함수가 외부 스코프의 변수에 접근할 수 있는 메커니즘을 말합니다. 함수가 외부 스코프의 변수를 참조하면 해당 함수는 클로저가 되며, 해당 변수의 상태를 유지하고 변경할 수 있습니다.
   
   

• 함수가 클로저가 되려면 해당 함수가 외부 스코프의 변수를 참조해야 합니다. 이때, 함수의 스코프 체인을 통해 외부 스코프의 변수를 찾을 수 있습니다.
• 스코프 체인을 통해 함수가 클로저가 될 때, 그 함수는 외부 스코프의 변수에 접근할 수 있으며, 이 변수의 상태를 변경할 수 있습니다.

예를 들어, 함수 A가 함수 B 내에서 정의되고 함수 A가 함수 B 내의 변수를 참조하면 함수 A는 클로저가 되며, 함수 B의 스코프 체인을 통해 함수 B 내의 변수에 접근할 수 있습니다.

렉시컬 변수(Lexical Variables)

렉시컬 변수는 렉시컬 환경에 저장된 변수입니다. 함수 내부에서 선언한 변수와 해당 함수 내에서만 접근 가능한 변수입니다. 렉시컬 변수는 클로저를 형성할 때 중요한 역할을 합니다.

 

클로저와 렉시컬 변수

클로저는 함수가 외부 스코프의 렉시컬 변수에 접근할 수 있는 메커니즘을 말합니다. 함수가 외부 스코프의 변수를 참조하면 그 함수는 클로저가 되며, 해당 변수의 상태를 유지하고 변경할 수 있습니다.

아래는 클로저와 렉시컬 변수의 관계를 보여주는 예제입니다.

javascriptCopy code
function createCounter() {
  let count = 0; // 렉시컬 변수

  function increment() {
    count++; // 외부 스코프의 렉시컬 변수에 접근
    console.log(count);
  }

  return increment;
}

const counter = createCounter();
counter(); // 1 출력
counter(); // 2 출력

위의 예제에서 increment 함수는 외부 스코프의 count 렉시컬 변수에 접근하고 변경합니다. 이를 통해 클로저가 형성되며, count 변수의 상태를 계속해서 유지하고 변경할 수 있습니다.