클로져 기초

javascript에서 함수는 전부 클로져 입니다.
그럼 애초에 클로져는 무엇일까요

클로져( Clouser )
클로져는 간단히 정의 하자면 [ 자신을 포함한 스코프에 있는 변수를 참조가능한 함수 ] 라고 말할 수 있습니다.

말로는 느낌이 확 오지 않을수 있지만, 코드를 하나씩 읽어 내려 간다면 입문으로서 클로져는 간단히 이해 가능합니다.

스코프( Scope )
우선 javascript는 함수별로 스코프가 만들어 집니다.
스코프라는 것은 변수를 참조가능한 범위 입니다.
그 범위외에는 변수는 참조가 불가능합니다.

function func() {
  var value = 1;
  console.log(value);
}
func(); // 1
console.log(value); // undefined

클로져의 예
여기서 크롤져의 예를 한번 볼까요

function func() {
  var value = 1;
 
  function innerFunc() {
    console.log(value);
  }
  innerFunc();
}
func(); // 1

방금전 클로져에 대한 정의를 떠올려 봅시다
[ 자신을 포함한 스코프에 잇는 변수를 참조 가능한 함수 ]

안쪽의 함수가 바깥쪽의 함수의 변수를 참조 가능하게 되어 있습니다.
여기서 중요한 것은 값을 복사하는 겂이 아니라, 참조가 가능하다는 것 입니다.

그렇기 때문에 여기서는 아래와 같은 value의 변경이 가능합니다.

function func() {
  var value = 1;
 
  function innerFunc() {
    value++;
  }
  innerFunc();
  console.log(value); // 2
}
func();

클로져의 실천예
여기서 기본적인 클로져의 실천예를 하나 들어 볼까합니다.
[ 모듈 패턴 ]을 소개합니다.

클로져의 이점중 하나가 변수를 private적인 변수로서 취급하는 것이 가능하다는 것입니다.

var module = (function() {
  var count = 0;
 
  return {
    increment: function() {
      count++;
    },
    show: function() {
      console.log(count);
    }
  };
 
})();
 
module.show(); // 0
 
module.increment();
module.show(); // 1
 
console.log(count); // undefined

임시함수를 사용하여 오브젝트를 생성합니다.
module에는 return 되고있는 오브젝트가 대입됩니다.

여기서 중요한것은, 임시함수내의 count에 관해서는 내부로부터만 참조된다는것 입니다.
외부로부터 접근 하려 하는 경우 당연히 [undefined]가 됩니다.

이것에 의해 private한 변수로서 사용하는것이 가능하게 됩니다.