클로저

Closure

클로저는 함수와 함수가 선언된 어휘적(정적.lexical) 환경의 조합니다.

함수와 함수가 접근할 수 있는 스코프가 클로저 관계를 맺는다.

반복문과 비동기 함수가 만날 때 클로저 문제가 자주 발생한다. 클로저의 특성을 사용하여 해결할 수 있는 문제다. 아래 코드에서 for문 안에 log(i) 값이 1씩 증가하는 것을 예상하지만, 함수 안의 변수는 "실행"될 때 값이 결정된다.

1. 함수에서 변수를 찾을 때 없으면 스코프체인을 따라 찾게 되고 그래도 없으면 전역에서 찾게된다.

2. 함수 안에서 선언된 변수는 함수안에서만 유효하다.

3. 비동기콜백함수의 변수는 함수가 실행될 때 값이 결정된다.

for(var i = 0; i < 100; i++) {
    setTimeout(function() {
        console.log(i);//i를 찾는다. 죽었다 깨나도 1번째 줄의 i가 된다.
    },i * 1000);
}//100만 나온다.
---------------------------------------------------------------------
//반복문을 쓰지 않았을 때
setTimeout(function() {
    console.log(i);//log(1) log(2) log(3) log(4) log(5)라고 예상하지만
}, 0*1000);//0초를 의미한다. 하지만 바로 실행되는 것을 의미하지 않는다.
setTimeout(function() {
    console.log(i);
}, 1*1000);//1초 뒤에 실행된다. 그제서야 i를 찾는다. 그 사이 for문은 반복문을 다 돈다.
setTimeout(function() {
    console.log(i);
}, 2*1000);
setTimeout(function() {
    console.log(i);
}, 3*1000);
setTimeout(function() {
    console.log(i);
}, 4*1000);
setTimeout(function() {
    console.log(i);
}, 5*1000);
setTimeout(function() {
    console.log(i);
}, 99*1000);