본문 바로가기

Study/JS

클로저 (Closure)

 클로저(Closure)

 

클로저에 대해 MDN은 아래와 같이 정의하고 있습니다.

“A closure is the combination of a function and the lexical environment within which that function was declared.”

클로저는 함수와 그 함수가 선언됐을 때의 렉시컬 환경(Lexical environment)과의 조합이다.

 

 

클로저란?

중첩함수가 외부함수보다 더 오래 유지되며, 상위 스코프의 식별자를 참조하는것이라고 할 수 있습니다.


외부함수보다 중첩함수가 더 오래 유지되는 경우,
중첩함수는 생명주기가 종료된 외부함수의 변수를 참조할 수 있으며 이러한 중첩함수를 클로저라 부릅니다.


클로저는 중첩함수가 상위 스코프의 식별자를 참조하고 있고,

중첩함수가 외부 함수보다 더 오래 유지되는 경우에 한정하는 것이 일반적입니다.

 

 

 

 

 

자유변수?

클로저에 의해 참조되는 상위 스코프의 변수를 자유변수라 부르며,
클로저란 함수가 자유변수에 대해 닫혀있다는 의미입니다. = 자유변수에 묶여있는 함수

클로저는 상태를 안전하게 변경하고 유지하기 위해 사용하며,
상태가 의도치 않게 변경되지 않도록 상태를 안전하게 은닉하고 특정함수에게만 상태변경을 허용하기 위해 사용합니다.

 

const increase = (function(){  // 카운트 상태 변경함수
  let num = 0;	 	      // 카운트 상태 변수
  return function () {	      //클로져
    return ++num;	      // 카운트 상태 +1
  };
}());
console.log(increase()); //1
console.log(increase()); //2
console.log(increase()); //3

 

위 코드가 실행되면 즉시실행함수가 호출되고, 즉시 실행함수가 반환한 함수가 increase 변수에 할당됩니다. 

increase변수에 할당된 함수는 자신의 정의된 위치에 의해 결정된 상위스코프인 즉시실행함수의 렉시컬 환경을 기억하는 클로저입니다.
즉시실행함수는 한번만 실행되므로 increase가 호출될때마다 num변수가 재차 초기화 될일은 없습니다.

 

또한 num 변수는 외부에서 직접 접근할 수없는 private변수이므로
전역변수를 사용했을 때와 같이 의도되지않은 변경을 걱정할 필요가없습니다.

이처럼 상태가 의도치않게 변경되지 않도록 안전하게 은닉하고,
특정함수에게만 상태변경을 허용하여 상태를 안전하게 변경하고 유지하기 위해 클로저를 사용합니다.

 

 

 

 

참조

https://poiemaweb.com/js-closure

'Study > JS' 카테고리의 다른 글

JS - Array.prototype.filter() 구현하기  (0) 2022.11.02
JS - Array.prototype.reduce() 구현하기  (0) 2022.11.02
진수변환  (0) 2022.09.29
JSON  (0) 2022.09.29
Map  (0) 2022.09.29