JS(6). 클로저

클로저는 함수가 자신이 생성될 때의 스코프를 기억하고, 그 스코프에 접근할 수 있는 함수를 말한다.

쉽게 말해, 함수가 만들어질 때 자기 주변 환경(스코프)을 기억하고, 그걸 나중에도 계속 사용할 수 있는 함수다.

예를 들어, 함수 안에 또 다른 함수가 있을 때, 바깥 함수의 변수를 내부 함수에서 계속 쓸 수 있다.
신기한 건, 바깥 함수가 실행을 다 끝냈는데도 내부 함수가 그 변수를 기억하고 있다는 것이다 .

클로저는 렉시컬 환경을 활용해 함수가 선언될 당시의 스코프를 기억합니다.

렉시컬 환경(Lexical Environment)이란?

JavaScript에서 변수와 함수의 스코프를 관리하고, 실행 중에 변수에 접근하거나 값을 변경할 수 있도록 돕는 내부적인 구조를 말한다.
이는 JavaScript의 실행 컨텍스트(Execution Context)와 밀접하게 관련된 개념으로, **코드가 작성된 위치(정적 스코프)**를 기반으로 동작한다.

쉽게 말해서 함수가 어디서 선언됐는지에 따라서 변수를 관리하는 시스템 같은 거라고 보면된다.

클로저의 정의

1. 함수와 함수가 선언될 때의 스코프가 결합된 객체.
2. 함수 외부에서 선언된 변수에 접근할 수 있는 함수

 

왜 클로저가 중요할까?

자바스크립트에서 함수는 단순히 실행하고 끝나는 것이 아니라, 외부 변수의 상태를 기억하고 관리할 수 있습니다. 클로저는 이와 같은 상태 유지, 정보 은닉, 캡슐화를 가능하게 해줍니다. 

클로저의 특징

• 함수 안에서 함수가 정의될 때 생성:
  • 내부 함수는 외부 함수의 변수에 접근할 수 있습니다.
  • 외부 함수가 실행을 종료해도, 내부 함수가 외부 변수에 접근 가능.
• 상태를 유지:
  • 클로저는 실행 컨텍스트가 사라진 후에도 외부 함수의 변수를 "기억"합니다.
  • 이를 통해 특정 데이터를 영구적으로 유지할 수 있습니다.

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

    function inner() {
        count++; // 외부 함수의 변수에 접근
        return count;
    }

    return inner;
}

const closureFunction1 = outer(); // `outer` 호출, 클로저 생성
console.log(closureFunction1()); // 1
console.log(closureFunction1()); // 2
console.log(closureFunction1()); // 3

const closureFunction2 = outer(); // `outer` 호출, 클로저 생성(새로운 클로저)
console.log(closureFunction2()); // 1
console.log(closureFunction2()); // 2
console.log(closureFunction2()); // 3

 

• 정보 은닉:
  • 클로저는 외부에서 접근할 수 없는 변수를 함수 내부에서만 사용할 수 있게 합니다.

function secretBox(secret) {
    return {
        getSecret: function () {
            return secret;
        },
        setSecret: function (newSecret) {
            secret = newSecret;
        }
    };
}

const box = secretBox("초기 비밀");
console.log(box.getSecret()); // "초기 비밀"
box.setSecret("새로운 비밀");
console.log(box.getSecret()); // "새로운 비밀"

 

왜 count가 유지될까?

1. 클로저 메커니즘:
   • inner 함수는 외부 함수 outer의 스코프에 대한 참조를 유지합니다.
   • 외부 함수의 실행이 종료되더라도, inner 함수가 외부 함수의 변수 count에 접근할 수 있습니다.
2. 메모리 관리:
   • 클로저를 생성한 함수는 실행 컨텍스트가 종료되더라도, 그 스코프를 참조하는 내부 함수가 있으면 해당 변수가 메모리에 유지됩니다.

 

클로저의 한계와 주의점

1. 메모리 누수 가능성
   • 클로저는 변수의 참조를 유지하므로, 불필요한 클로저가 많아지면 메모리를 낭비할 수 있습니다.
2. 디버깅의 어려움
   • 클로저는 내부적으로 스코프 체인을 유지하므로 디버깅할 때 변수의 참조를 추적하기 어려울 수 있습니다.