Day 24 · 4/5
🌱 기초 프론트엔드

클로저(Closure)가 뭔가요?

쉽게 이해하기

어릴 적 살던 동네를 떠나도, 그때의 기억과 감정은 계속 간직하고 있죠. 클로저도 비슷해요. 함수가 만들어진 곳을 떠나도, 그곳의 변수들을 계속 기억하고 사용할 수 있습니다.

핵심 정리

함수가 선언될 때의 환경을 기억해서, 나중에도 그 환경에 접근할 수 있게 해주는 기능이에요.

자세히 알아보기

클로저는 JavaScript의 독특하고 강력한 기능이에요. 함수 안에서 다른 함수를 만들면, 내부 함수는 외부 함수의 변수에 접근할 수 있어요. 그런데 외부 함수가 실행을 마쳐도, 내부 함수는 여전히 외부 함수의 변수를 기억하고 있죠. 이것이 클로저입니다. 실무에서는 주로 데이터 은닉(private 변수)을 만들 때 사용해요. 예를 들어 카운터 함수를 만든다면, count 변수를 외부에서 직접 수정하지 못하게 하고 increase, decrease 같은 함수로만 조작하게 할 수 있어요. 이렇게 하면 데이터의 무결성을 보호할 수 있습니다. 또 다른 활용은 이벤트 핸들러나 콜백 함수예요. 반복문 안에서 이벤트 리스너를 등록할 때, 각 리스너가 자신만의 변수 값을 기억하게 하려면 클로저를 사용해야 해요. React의 useState 훅도 내부적으로 클로저를 활용해서 상태 값을 유지합니다. 클로저는 처음엔 어렵게 느껴질 수 있지만, JavaScript의 스코프와 함수를 이해하는 핵심 개념이에요. 특히 모던 JavaScript에서는 모듈 시스템, 함수형 프로그래밍 패턴 등에서 클로저가 자연스럽게 사용됩니다. 클로저를 이해하면 더 안전하고 깔끔한 코드를 작성할 수 있어요.