[Javascript] 클로저 Closure

정의

• 이미 생명 주기가 끝난 외부 함수의 변수를 참조하는 함수를 클로저라고 한다.
  • 최종적으로 반환되는 함수가 외부(부모) 함수의 지역 변수에 접근할 때 발생한다.
• 함수가 종료되어 외부 함수의 컨텍스트가 반환되더라도 변수 객체는 반환되는 내부 함수의 스코프 체인에 그대로 남아있어야만 접근할 수 있다.
  • 실행이 종료된(사라진) 실행 컨텍스트의 변수 객체를 다른 실행 컨텍스트의 스코프 체인으로 참조되고 있는 것
• 클로저라는 이름은 함수가 자유 변수에 대해 닫혀있다는 의미인데 의역하면 '자유 변수에 엮여있는 함수'라고 할 수 있다.

 

과정

1. 외부 함수의 호출이 이루어지고, 이 외부 함수에서 새로운 함수가 반환된다(클로저)
2. 반환된 함수가 클로저이고 이 클로저는 외부 함수의 지역 변수를 사용한다.(자유 변수)
3. 반환된 클로저는 새로운 함수로 사용된다.

 

자유 변수

• 클로저로 참조되는 외부 변수를 자유 변수(free variable)라고 한다.

 

활용

• 클로저는 자바스크립트에만 있는 개념이 아니다. 함수를 일급 객체로 취급하는 언어(보통 이를 함수형 언어라고 한다)에서 주요하게 사용되는 특성
• 클로저는 성능적인 면과 자원적인 면에서 약간 손해를 볼 수 있으므로 무차별적으로 사용해서는 안된다.
  • 대부분의 클로저에서는 스코프 체인에서 뒤쪽에 있는 객체에 자주 접근하므로(외부 함수의 변수 객체), 성능을 저하시키는 이유로 지목되기도 한다.
  • 스코프 체인에 변수 객체를 많이 가지고 있으므로 메모리 부담이 많아진다.

 

1. 특정 함수에 사용자가 정의한 객체의 메서드 연결하기
   • 정해진 형식의 함수를 콜백해주는 라이브러리가 있을 경우, 그 정해진 형식과는 다른 형식의 사용자 정의 함수를 호출할 때 유용하게 사용된다.
   • 정해진 인자 외의 원하는 인자를 더 추가해서 사용하고 싶을 때 활용할 수 있다.
2. 함수의 캡슐화
   • 입력된 값을 기존의 값과 활용하여 어떤 결과를 낼 때, 기존의 값을 어디엔가 저장해놔야 한다.
   • 이 경우 저장된 값이 다른 함수에서도 접근이 가능하고 변경될 수도 있는 위험이 있다. (이로 인해 버그 발생 가능)
   • 사용할 값을 자유 변수로 가지는 클로저를 활용하면 이런 문제를 해결할 수 있다.
3. setTimeout()에 지정되는 함수의 사용자 정의
   • setTimeout 함수는 웹 브라우저에서 제공하는 함수인데, 첫 번째 인자로 넘겨지는 함수 실행의 스케쥴링을 할 수 있다.
   • setTimeout으로 자신의 코드를 호출하면서 인자를 넘겨받고 싶을 때 클로저를 사용할 수 있다.

 

주의 사항

클로저는 자바스크립트의 강력한 기능이지만, 너무 남발하여 사용하면 안 된다.

 

1. 클로저의 프로퍼티 값이 쓰기 가능하므로 항상 변할 수 있음에 유의해야 한다.
2. 하나의 클로저가 여러 함수 객체의 스코프 체인에 들어가 있는 경우도 있다.
3. 루프 안에서 클로저를 활용할 때는 주의하자.

 

출처

• 인사이드 자바스크립트