클로저

클로저(closure)

내부 함수 내에서 외부 함수의 변수에 접근하는 것을 말한다. (그 반대는 안됨!)
외부 함수에서 변수를 선언하고 그 변수를 내부 함수가 사용하고 있다면, 내부 함수가 끝날 때까지 소멸하지 않는다.

예제

function outFunc() {
    var out = 'outFunc';
    function inFunc() {
        var inf = 'inFunc';
        return console.log(out + ', ' + inf);
    }
    inFunc();
}

outFunc(); // outFunc, inFunc

해당 함수를 실행하면, 내부함수 안에 out이라는 변수가 존재하여 값이 outFunc, inFunc 가 나오는 것을 볼 수 있다.
그렇다면, 내부함수에서 out을 빼보고 inFunc 안에 브레이크 포인트를 걸어보자.

function outFunc() {
    var out = 'outFunc';
    function inFunc() {
        var inf = 'inFunc';
        debugger; // 디버거!
        return console.log(', ' + inf);
    }
    inFunc();
}

outFunc(); // outFunc, inFunc

디버거가 걸린 구간에서 out 이라는 변수가 존재하지 않는 것을 알 수 있다.
내부 함수에서 out의 변수를 사용시에는 존재했지만, 사용하지 않으면 변수가 소멸했다는 것을 볼 수 있다.

클로저는 자바스크립트를 하다보면, 금방 경험하게 되는데 갑자기 변수가 소멸했거나, 내부 함수에서 외부 함수의
변수를 쓰는 경우에 당황하지 말자..

장점

외부 함수의 변수를 가져다가 사용할 수 있어, 변수를 재사용하여 코드의 수를 줄일 수 있습니다.