Closure
- 클로져는 함수의 실행이 끝난 뒤에도 함수에 선언된 변수의 값을 접근할 수 있는 JS의 성질.
function addCounter() {
var counter = 0;
return function() {
return counter++;
};
}
- 위 코드는 addCounter()라는 함수를 하나 생성하고 counter 변수를 하나 선언. 유효볌위를 생각해보면, counter라는 변수는 현재 함수 안에 선언되어 있기 때문에 함수 안에서만 유효함.
function addCounter() {
var counter = 0;
}
addCounter();
console.log(counter); // Uncaught ReferenceError: counter is not defined
- 함수 밖에서 counter 변수를 참조하려고 하면 오류가 발생.
그 이유는 함수 밖에서 counter 라는 변수가 선언된적이 없기 때문.
function addCounter() {
var counter = 0;
return function() {
return counter++;
};
}
- 여기서 함수를 반환할 수 있는 이유는 '함수를 변수나 인자로 넘길 수 있는 JS의 성질 (일급 객체)' 때문.
addCounter();
console.log(addCounter());
ƒ () {
return counter++;
}
- addCounter 함수의 역할은 addCounter()함수를 실행했을 때 함수를 반환하는 것
function addCounter() {
var counter = 0;
return function() {
return counter++;
};
}
addCounter();
console.log(counter); // Uncaught ReferenceError: counter is not defined
- addCounter()함수의 실행이 끝난 시점에서는 counter라는 변수는 더이상 접근할 수 없는 상태. 함수 안에 선언한 변수는 함수 안에서만 유효 범위를 갖게 때문.
function addCounter() {
var counter = 0;
return function() {
return counter++;
};
}
var add = addCounter();
add(); // 0
add(); // 1
add(); // 2