2-1.클로저와메모리관리.md

back    |    write by Santos

2-1.클로저와 메모리 관리.

---

* 이 글은 코어자바스크립트 책을 참고하여 기록하였습니다.

클로저는 메모리 누수의 원인이라고 주장하지만, 관리법만 잘 파악해서 적용한다면, 최선의 선택이 될 수 있음.

1. 클로저와 메모리 관리

예시1 (return에 의한 클로저의 메모리 해제) 😎

var outer = (function (){
    var a = 1;
    var inner = function (){
        return ++a;
    };

    return inner;
});

console.log(outer());
console.log(outer());
outer = null;                          // outer 식별자의 inner 함수 참조를 끊음.

예시2 (setInterval에 의한 클로저의 메모리 해제) 😎

(function (){
    var a = 0;
    var intervalId = null;
    var inner function (){
        if(++a >= 10){
            clearInterval(intervalId);
            inner = null;              // inner 식별자의 함수 참조를 끊음.
        }
        console.log(a);  
    };
    intervalId = setInterval(inner, 1000);
})();                     

예시3 (eventListener에 의한 클로저의 메모리 해제) 😎

(function (){
    var count = 0;
    var button = document.createElement('button');
    button.innerText = 'click';

    var clickHandler = function (){
        console.log(++count, 'times clicked');
        if(count >= 10){
            button.removeEventListener('click', clickHandler);
            clickHandler = null;       // clickHandler 식별자의 함수 참조를 끊음.
        }
    }
})

* 예시를 통해 알아야 할 것들 🤔

1. 클로저는 함수의 지역 변수 메모리를 소모하도록 함으로써 발생하기 때문에, 필요성이 사라진 시점에서 메모리를 소모하지 않게 하면 됨.

2. 즉, 가비지 컬렉터가 수거해 갈수 있도록 참조 카운트를 0으로 만들면 됨.

3. 참조 카운트를 0으로 만드는 방법은 식별자에 기본형 데이터(보통은 null, undefined)를 할당하면 됨.

읽어 주셔서 감사합니다.

---

<참고자료>

[책] #코어자바스트립트 - 정재남 지음 -

<클로저> 클로저와 메모리 관리 end

---