클로져(Closure) is what?
Scope에 제약을 받지 않는 변수들을 포함하고 있는 코드블록이다.

이러한 변수들은 코드블럭이나 글로벌 컨텍스트에서 정의되지 않고 코드 블록이 정의된 환경에서 정의된다.

"클로져"라는 명칭은 실행할 코드블록(자유 변수의 관점에서, 변수 레퍼런스와 관련하여 폐쇄적이지 않는) 과 자유변수들에 대한 바인딩을 제공하는 평가 환경(범위)의 결합에서 탄생한 것이다.

사실 저런 이야기 매우 어렵습니다.   그래서 좀더 어렵고 혼돈되게 책에 있는 내용을 인용합니다.

From javascript definitive guide 5th


This combination of code and scope is known as a closure (…). All
Javascript functions are closures.

When a nested function is exported outside the scope in which it is defined

When a nested function is used in this way, it is often explicitly called a closure


이 코드와
스코프의 조합은 클로져 알려져 있습니다.
자바스크립트 모든 함수들은
클로져입니다.

중첩합수가 함수 정의하는 것을 스코프 밖에서 이루어질 때 입니다.

중첩함수를 이 방식으로 사용할 때 그것은 자주 명백하게 클로져 불러지고 있습니다.


2008.10.14 추가내용

When a nested function is exported outside the scope in which it is defined

"중첩된 함수가 그 함수가 정의된 유효 범위의 바깥으로 익스포트(export)될 때다."

 (한글 번역서p.191)<낭망백수님 의견>

매우 혼동스러워 집니다.  그래서 클로져라는게 도대체 무엇인지 개념적으로 A = B이다. 라고 답을 낸 다는 것은 너무 단편적인 결론을 요구하는 것이기 때문에 클로져의 개념을 이해하는 것을 목적으로 둡니다..

좀더 빠른 이해를 돕기 위해서 그림으로 표현해봅니다.

사용자 삽입 이미지

outerFn()은 우리가 알고 있는 function입니다.   function을 수행하게 되면 var을 통해서 function 내에서만 사용되거나 설정되는 variable을 가집니다. 이는 달리 말해 function scope에서만 참조되는 변수이지만 경우에 따라 클로져(closure)에 의해서 참조가 가능해진다는 것입니다.

outerFn 내의 var closure='is Closure.'; 는 메모리에 적재를 하게 되고 이는 outerFn이 수행될때 해당 메모리를 참조하게 되고 수행이 종료되고 참조가 없어지면 자동으로 GC(가비지 컬렉션)이 일어나 메모리에서 해제되게 됩니다.

하지만 var closure = 'is Closure.'; 를 어디선가 참조를 하고 있다면 아니 그전에 다른곳에서 참조가 발생할 때 바로 클로져가 생성되면서 클로저를 통해서 해당 variable를 참조하게 됩니다.

사용자 삽입 이미지
위에서 볼때 func에는 outerFn에 의해서 반환된 function을 가지고 있습니다.  이 function은 outerFn이 가지고 있는 내부 variable를 참조하고 있습니다.  이때 outerFn이 갖은 variable을 외부에서 참조하려고 하니 쉽게 private를 public으로 참조하려고 하니 과연 되지 않아야 하지만 우리의 javascript의 유연함은 이뤄 말할 수 없을 만큼의 기능을 가지고 있습니다.

아무튼 그렇게 클로져는 이런 상태에서 private를 참조하려고 시도할 때 발상하여 해당 참조를 해야하는 function의 즉 outerFn의 코드블럭을 클로져를 통해서 참조할 수 있게 됩니다.  클로져 자체가 코드블럭이라 해도 과언이 아니겠습니다.

위의 그림에서는 클로져가 발생했고 이는 GC에 의해서 메모리 해제가 되지 않습니다.  즉 func 이 계속적으로 클로져를 통하여 var closure = 'is Closure.'; 를 계속 참조하고 있기 때문입니다.  그래서 우리는 강제적으로 클로저를 해제할 수 있는 상태를 만들어 주어야 합니다.

사용자 삽입 이미지

'조만간 Gabage Collection in Javascript 에 대한 글을 포스팅하려 준비중입니다.  그때 좀더 자세한 사항을 포스팅하도록 하겠습니다. 약속'

var func = outerFn(); 을 하고.
     func('function'); 을 통해서 원하는 결과 값을 얻었다면 var func = null; 을 통해서 클로져를 통한 참조 point를 null 시켜주게 되면 주기적으로 GC에 의해서 메모리에서 반환되게 됩니다.


결론
사용자 삽입 이미지
  Scope에 제약을 받지 않는 변수들을 포함하고 있는 코드블록이다.
그리고 이는 Javascript에서 메모리 누수를 발생하는 요인중에 하나이다.



참조 :
 1,
http://www.ibm.com/developerworks/kr/library/j-jtp04247.html
 2.
http://en.wikipedia.org/wiki/Closure_%28computer_science%29


Posted by Rhio.kim

댓글을 달아 주세요

  1. 쇼팬하워 2008.03.18 01:49  댓글주소  수정/삭제  댓글쓰기

    나이거 보면볼수록 신기하다는...쉽게 알수있는방법..ㅠㅠ 없나용. js 는 어려워...

  2. 쇼팬하워 2008.03.19 23:42  댓글주소  수정/삭제  댓글쓰기

    언제 지식 맞트레이트 함 하실래요.ㅋㅋ 전 자바 님은 자바스크립트 윈윈.하죠..^^;

  3. 2008.03.20 10:52  댓글주소  수정/삭제  댓글쓰기

    비밀댓글입니다

  4. BlogIcon oritnox 2008.04.24 00:58 신고  댓글주소  수정/삭제  댓글쓰기

    빨리 Gabage Collection in Javascript 올려주세요!!

    • BlogIcon Rhio.kim 2008.04.24 15:40 신고  댓글주소  수정/삭제

      제목을 처음에 gabage collection in javascript로 했다가 내용이 조금 엊나가서 바꿨어요.
      http://blog.ecmas4.com/216
      이거 참고해주세요.. ^^;

      gabage collection 이 javascript에서만 특별한 무엇인가가 있는 것도 아니고 개념적으로 java와 틀린점은 조금 알고 RIA 개발 시에 알아야 할 memeory 관리차원에서 접근을 했습니다.

      Migration Tip Test 글과 함께 보시면 될꺼에요.

  5. BlogIcon 낭망백수 2008.10.14 18:41  댓글주소  수정/삭제  댓글쓰기

    JsDG 5판 한역이 나왔습니다. 그래서 번역하신 부분 "중첩합수가 함수 정의하는 것을 스코프 밖에서 이루어질 때 입니다." 을 찾아보니 "중첩된 함수가 그 함수가 정의된 유효 범위의 바깥으로 익스포트(export)될 때다."(p.191) 라고 나오네요. 개인적인 생각으로는, 이런 '때'란, 중첩된 함수를 리턴하는 경우'가 거의 유일하지 않을까 싶습니다. 그림으로 설명한 것이 참 좋네요. ^^; 꾸벅~!

  6. kzOne 2009.02.11 16:00  댓글주소  수정/삭제  댓글쓰기

    좋은 내용 감사드립니다.
    안 그래도 자바스크립트 완벽가이드 5th 번역판을 보면서
    도데체 클로져가 무슨소리인가 했는데...
    그림으로 보니 어느정도 이해가 되네요
    감사합니다~~~

  7. 2Jordan3 2010.03.25 00:28  댓글주소  수정/삭제  댓글쓰기

    좋은 글 감사합니다... (__)
    Closer에 대한 궁금증을 여기서 풀고 가네요...^^

  8. darkr310 2011.05.27 16:24  댓글주소  수정/삭제  댓글쓰기

    포스팅 감사합니다. 제 능력이 떨어지져 85% 밖에 이해는 못하였지만, 다른 정보에 비하면 접근력을 키워주신것만으로도 감격입니다. 트위터도 열심히 열람하고 있다는. ^^ 화이팅.

    • BlogIcon Rhio.kim 2011.05.30 01:40 신고  댓글주소  수정/삭제

      ^^ 85%면 얼마나 이해된거죠? 궁금하신거 있으시면 언제든지 트위터로 질문 주세요. 저 말고도 알려주실 구루들이 많이 있으니까요. :)

  9. agapeuni 2013.01.14 23:38  댓글주소  수정/삭제  댓글쓰기

    좋은글 출처를 표시하고 블로그에 담아갑니다. ^^