JS - 클로저의 이해

클로저(Closure)는 함수 내부에 다른 함수를 만들면 이것을 클로저라 부릅니다. 이렇게 만들어진 내부 함수는 외부 함수의 변수나 파라미터에도 접근하게 됩니다.

하지만 외부 함수는 여전히 내부 함수의 변수에 접근할 수는 없습니다.

<script>
 function aaa() {
   var a = '하보니';
   function aaaa() {
     return a;
   }
   return aaaa;
 }
 var aa = aaa();

document.write( aa() ); // 하보니
</script>

클로저는 외부 함수의 파라미터에도 접근할 수 있습니다.

<script>
 function aaa(a) {
   function aaaa() {
     return a;
   }
   return aaaa;
 }
 var aa = aaa("하보니");

 document.write( aa() ); // 하보니
</script>

다음에서 좀 더 흥미로운 결과를 얻을 수 있습니다.

<script>
 function aaa(a) {
   function aaaa(b) {
     return a + b;
   }
   return aaaa;
 }
 var aa = aaa("하보니");

 document.write( aa("php") ); // 하보니php
</script>

<script>
 function makeclosure(a) {
   return function(b) {
     return a + b;
   };
 }

 var closure1 = makeclosure(5);
 var closure2 = makeclosure(10);

 document.write( closure1(2) );  // 7
 document.write( closure2(2) ); // 12
</script>

<script>
 function makeCount(num) {
   var count = num;
   function plus() {
     count++;
     document.write(count);
   }
   return plus;
 }

 var count1 = makeCount(2);
 var count2 = makeCount(15);

 count1(); // 3
 count2(); // 16
</script>

클로저를 이용해서 private 로 선언할 수 있습니다.

여기서 private 란 클래스 내부의 메소드에서만 호출할 있는 메소드를 말합니다. 따라서 private 를 정의하면 외부로부터 액세스될 염려는 하지 않아도 됩니다. private 를 정의할 때 this.메소드 또는 this.프로퍼티와 같은 this 가 아니라 var 로 선언된 count 나 내부에 선언된 change() 와 같은 메소드를 말합니다.

<script>
 function private_method() {
   var count = 0;
   function change(val) {
     count += val;
   }
   return {
     plus: function() {
       change(1);
     },
     minus: function() {
       change(-1);
     },
     value: function() {
       return count;
     }
   };   
 }
 var counter = private_method();

 document.write( counter.value() ); // 0
 counter.plus();
 counter.plus();
 counter.plus();

 document.write( counter.value() ); // 3
 counter.minus();
 counter.minus();
 document.write( counter.value() ); // 1
</script>