클로저

클로저

외부 함수의 참조 값을 외부 함수가 종료되었는데도 참조 할 수 있는 것

외부 함수의 실행 컨텍스트가 종료되었을 때, 외부함수 내의 참조 값들이 가비지 컬렉션에 의해서 사라지게 되지만, 외부로 전달을 하면 외부 함수에 있던 참조 값들을 사용할 수 있게 된다.

예시 1
return 을 통한 외부 전달

function outer() {  
  let num = 0  
  function inner() {  
   return num += 1;  
  }  
  return inner  
}  

let increment = outer() // outer 의 num 을 참조하는 increment 라는 식별자가 있기 때문에 클로져로 사용 가능해짐  
increment() // 1  
increment() // 2  
incremnt = null // 메모리 회수   
const increment2 = outer() // 새로운 클로저  
increment2() // 1  

예시 2-1
return 없이 외부 전달

(function () {  
var a = 0;  
   var intervalId = null;  
   var inner = function () {  
     if(++a >= 10) {  
  clearInterval(intervalId)  
        console.log('done')  
        }  
      console.log(a)  
    }  
intervalId = setInterval(inner, 300);  
})()  

예시 2-2
return 없이 외부 전달

(function () {  
var count = 0;  
var button = document.createElement("button");  
button.innerText = "click";  
button.addEventListener("click", function () {  
console.log(++count, "times, clicked");  
});  
document.body.appendChild(button);  
})();