함수가 선언된 시점에 상위 스코프가 결정되는것
var x = 1;
function foo() {
var x = 10;
// 동적스코프라면 호출한 시점에 상위스코프가 결정됨 (10)
bar();
}
// 선언된시점에 상위스코프가 결정됨
function bar() {
console.log(x);
}
foo();
bar();
결과(렉시컬스코프)
1
1
만약 동적스코프라면 (호출한 시점에 스코프가 정의됨)
10
1
하단코드에서 내부함수를 클로저라고 한다.
const 외부함수 = () => {
let x = 10; // private 변수(외부에서 접근 불가)
// 클로저
// 내부함수에서 x는 렉시컬 스코프에의해 외부함수의 x를 참조함
const 내부함수 = (y) => {
x = x + y;
console.log(x);
}
return 내부함수;
}
const addFunc = 외부함수();
addFunc(5); // 15
addFunc(10); // 25
위의 코드를 아래로 바꾸면 좀더 이해가 쉽다.
const 외부함수 = () => {
let x = 10; // private 변수(외부에서 접근 불가)
// 클로저
const 내부함수 = (y) => {
x = x + y;
console.log(x);
}
return 내부함수;
}
// 외부함수를 실행한것이므로 addFunc = return 내부함수
const addFunc = (y) => {
x = x + y;
console.log(x);
}
addFunc(5); // 15
addFunc(10); // 25
위 코드를보면 x는 존재하지않는데 결과가 어디선가 x+y 가 계산되어 값이 나온다.
즉 클로저 함수는
자신이 생성될 때의 환경(렉시컬 스코프)을 기억하는 함수
특징
자신을 포함하고 있는 외부함수보다 내부함수가 더 오래 유지되는 경우
외부 함수 밖에서 내부함수가 호출되더라도
외부함수의 지역 변수에 접근할 수 있음