[JavaScript] 클로저(closure)

📌 정의

클로저(Closure)는 함수와 함수가 정의된 어휘 환경(Lexical Environment) 사이의 관계를 의미한다.
해당 함수안에 함수를 선언한 환경은 내부 함수에서 외부 함수로 지역변수를 접근할 수 있지만 외부 함수의 실행이 끝나고 외부 함수가 소멸된 이후에도 내부 함수가 외부 함수의 변수에 접근할 수 있는 것을 의미한다.

❗️특징

1) 함수 내부에서 함수 정의: 클로저가 생성되려면 함수가 다른 함수 내에서 정의되어야 한다. 이것을 내부 함수(inner function)라고 부르며, 외부 함수(outer function) 안에서 정의된다.

2) 외부 변수 접근: 클로저 함수는 외부 함수의 변수에 접근할 수 있습니다. 이는 외부 함수의 변수가 클로저 함수 내에서 "캡처"되고, 나중에 클로저 함수에서 사용될 수 있도록 보존된다.

3) 어휘적 범위(lexical scope): 클로저 함수는 어휘적 범위를 따릅니다. 즉, 클로저 함수가 정의될 때의 외부 함수의 변수 상태를 기억하며, 그 상태를 사용된다.

✍ 예시 코드

function outerFunction() {
  const outerVariable = "I am from the outer function";
  
  function innerFunction() {
    console.log(outerVariable); // outerVariable에 접근
  }

  return innerFunction; // innerFunction을 반환
}

const myClosure = outerFunction(); // outerFunction을 호출하고 innerFunction을 반환함

myClosure(); // myClosure를 호출하여 innerFunction 실행

innerFunction은 outerFunction 내에서 정의되었으며, outerVariable이라는 외부 변수에 접근한다. outerFunction은 innerFunction을 반환하고, 반환된 함수를 myClosure 변수에 할당합니다. 이후 myClosure()를 호출하면 innerFunction이 실행되고, outerVariable 값이 출력된다.

❗️ 이렇게 innerFunction은 outerFunction의 스코프에 접근할 수 있으며, outerVariable을 참조할 수 있다. 이것이 클로저의 핵심 아이디어이며, 함수가 정의된 스코프를 기억하고 해당 스코프에 있는 변수를 사용할 수 있게 해준다.