자바스크립트 클로저1

출처 : 인사이드 자바스크립트

자바스크립트에서 함수는 일급객체 이다.

일급객체(First Class)인 함수 Function은 아래와 같은 동작이 가능하다.

• 리터럴에 의해 생성
• 변수나 배열의 요소, 객체의 프로퍼티 등에 할당 가능
• 함수의 인자로 전달 가능
• 함수의 리턴값으로 리턴 가능
• 동적으로 프로퍼티를 생성 및 할당 가능

따라서 일급객체인 특성을 가지고 있는 자바스크립트 함수는 함수형 프로그래밍이 가능하다.

여기서 숫자, 문자열, 불린값, null undefined 는 기본타입으로 '값에 의한 호출' Call By Value  방식으로 동작하고

그 외에는 참조타입으로 '참조에 의한 호출' Call By Reference 방식으로 동작한다.

클로저가 왜 필요한지 그 이유는 많지만 그 중 하나만 보자면 자바스크립트의 참조타입 때문이다.

아래의 간단한 코드를 보면 위, 아래 각각 버튼이 4개씩 존재한다.

그리고 그것들을 클릭할 경우 간단한 alert 창이 뜨도록 해놓았다.

1-1 ~ 1-4 를 눌러보면 전부 4라고 뜬다.

2-1 ~ 2-4 를 눌러보면 0, 1, 2, 3 라고 뜬다.

1-1 ~ 1-4 에서는 i의 값이 최종적으로는 4로 끝났고, 각각의 함수가 실행할때 최종 값인 i=4 값을 참조하기 때문이다.

하지만 2-1 ~ 2-4는 각각의 값이 나오는데 이것은 t2 함수가 리턴할 때 해당되는 숫자를 포함한 상태로 메소드를 리턴하기 때문이다.

즉 클로저는 '이미 생명 주기가 끝난 외부 함수의 변수를 참조하는 함수' 인것이다. 

위의 코드는 아주 간단한 예제지만 저렇게 각 요소에 for 문으로 실행하면서 각각 다른 값을 넣어줄때 클로저를 사용해주면 편하다.