자바스크립트에서 클로저(Closure)는 함수와 그 함수가 선언된 환경(스코프)을 하나로 묶은 개념입니다. 자바스크립트의 모든 함수는 기본적으로 클로저처럼 동작합니다.
클로저의 핵심은 함수가 호출된 위치가 아니라 선언된 위치의 스코프를 사용한다는 점입니다. 따라서 함수가 나중에 다른 곳에서 실행되더라도, 정의될 당시 접근 가능했던 외부 변수들을 계속 참조할 수 있습니다.
클로저 동작 예제
아래 코드를 직접 실행해 보면 클로저가 어떻게 작동하는지 확인할 수 있습니다.
<!DOCTYPE html>
<html>
<body>
<h2>자바스크립트 클로저 활용</h2>
<script>
var p = 10;
function a() {
var p = 15;
b(function() {
alert(p);
});
}
function b(f){
var p = 30;
f();
}
a();
</script>
</body>
</html>실행 결과 분석
alert 창에는 전역 변수의 값 10도, 함수 b의 지역 변수 값 30도 아닌 15가 표시됩니다. 그 이유는 익명 함수가 함수 a 내부에서 선언되었기 때문입니다. 클로저는 함수가 선언된 시점의 스코프를 기억하므로, 함수 b 안에서 호출되었음에도 불구하고 함수 a의 지역 변수 p(값 15)에 접근하게 됩니다.
이처럼 클로저를 활용하면 함수가 생성된 환경의 변수를 유지하고 참조할 수 있습니다. 덕분에 데이터 은닉, 상태 유지, 콜백 함수 처리 등 다양한 프로그래밍 패턴에서 클로저가 널리 사용됩니다.