익명 함수(Anonymous Function)란?
익명 함수는 이름 그대로 함수 이름 없이 정의되는 함수를 의미합니다. 이름 식별자 없이 생성되기 때문에 주로 다른 함수의 인자(argument)로 전달되어 사용되며, 변수에 할당한 뒤 해당 변수 이름을 통해 호출할 수 있습니다.
익명 함수 기본 사용 예시
var func = function() {
alert('This is anonymous');
}
func();위 코드에서는 익명 함수가 func라는 변수에 할당된 후, 변수 이름으로 호출됩니다.
콜백으로 활용하는 익명 함수
익명 함수는 콜백(callback) 형태로도 널리 활용됩니다. 아래 예제처럼 setTimeout에 직접 전달할 수 있습니다.
setTimeout(function() {
alert('Demo');
}, 3000);이 코드는 3000밀리초(3초) 후에 'Demo'라는 알림창을 띄우는 익명 함수를 실행합니다.
자바스크립트 클로저(Closure)란?
자바스크립트에서는 모든 함수가 클로저처럼 동작합니다. 클로저란 함수가 선언된 시점의 스코프(scope)를 기억하여, 호출될 때 자신이 선언된 환경의 변수에 접근할 수 있는 함수를 말합니다. 중요한 점은 함수가 호출된 위치의 스코프가 아니라 선언된 위치의 스코프를 사용한다는 것입니다.
클로저 동작 원리 예제
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Closures</h2>
<script>
var p = 20;
function a() {
var p = 40;
b(function() {
alert(p);
});
}
function b(f) {
var p = 60;
f();
}
a();
</script>
</body>
</html>실행 결과 분석
위 예제를 실행하면 알림창에는 40이 표시됩니다. 그 이유는 다음과 같습니다.
- 전역 스코프의
p는 20입니다. - 함수
a()내부에서 지역 변수p = 40이 선언되고, 이때 익명 함수가 생성됩니다. - 함수
b()내부에는 별도의 지역 변수p = 60이 있지만, 익명 함수는 여기서 호출되었을지라도 선언된 위치인 함수a()의 스코프를 기억합니다. - 따라서 익명 함수가 실행될 때 참조하는
p의 값은 60이 아니라 40이 됩니다.
이것이 바로 클로저의 핵심 개념입니다. 함수는 자신이 태어난 렉시컬 환경(lexical environment)을 기억하며, 이를 통해 외부 함수의 변수에 계속 접근할 수 있습니다.
정리: 익명 함수와 클로저의 차이
| 구분 | 익명 함수 | 클로저 |
|---|---|---|
| 정의 | 이름 없이 정의되는 함수 | 선언된 스코프를 기억하는 함수 |
| 주요 용도 | 콜백, 즉시 실행 함수 등 | 상태 유지, 데이터 은닉 등 |
| 핵심 특징 | 변수에 할당해 호출 가능 | 선언 당시의 변수 환경에 접근 |
두 개념은 서로 배타적이지 않습니다. 실제로 위 예제에서 보듯이 익명 함수가 클로저로 동작하는 경우가 많습니다. 자바스크립트의 스코프 체인과 렉시컬 환경을 이해하면 두 개념을 더욱 명확하게 구분하고 활용할 수 있습니다.