[scope & closure] 어떤 상황에서 closure를 사용해야하는지 설명해주세요.

[ddongule]

제곧내

[shinsehantan]

자바스크립트에 클로저라는 기능이 없다면 상태를 유지하기 위해 전역 변수를 사용할 수 밖에 없는데, 전역변수는 많은 부작용을 유발하기 때문에 클로저를 사용하면 유용하다.

var counter = 0;

    function increase() {
      return ++counter;
    }

increase() // 대충 어떤 버튼에 걸려있다고 가정하고

예를 들어 위와 같은 코드에서는 counter를 전역에 두어야만 하는데

var increase = (function () {
      // 카운트 상태를 유지하기 위한 자유 변수
      var counter = 0;
      // 클로저를 반환
      return function () {
        return ++counter;
      };
    }());

increase()

이렇게 변경하면 전역변수를 사용하지 않을 수 있다! 우선 '즉시실행함수'이기 때문에 바로 실행되고 변수 increase에는 function() { return ++counter;} 가 할당된다. increase가 계속 사용되기 때문에 이 함수는 생성 시점의 렉시컬 환경을 계속 기억하고, 스코프에 속한 지역변수 counter에 접근할 수 있다.

[Tanney-102]

• 즉시 실행 함수를 이용한 모듈화
• 디바운스, 쓰로틀 등을 구현할 때 setTimeout의 timer를 기록하는 것과 같이 정적이 변수가 필요한 경우