클로저(closure)는 내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것을 가르킨다. 클로저는 자바스크립트를 이용한 고난이도의 테크닉을 구사하는데 필수적인 개념으로 활용된다.
function outter(){ function inner(){ var title = 'coding everybody'; alert(title); } inner(); } outter();
- 예제에서 outter라는 함수를 외부함수, 외부함수 안에 있는 inner라는 함수를 내부함수라고 정의한다
- 위에 예제 내부 함수 inner를 다르게 정의를 하면
function outter(){ var inner = function inner(){ var title = 'coding everybody'; alert(title); } inner(); } outter();
outter라는 함수의 inner라는 지역변수가 된다
- 어떠한 함수가 있고 그 함수안에서만 사용하는 함수가 있을 수 있다. 그런 경우에 함수 바깥에 함수를 정의하는 것보다 함수 내부에 정의를 하면 응집성과 가독성, 실수를 줄이는데 좋다
function outter(){ var title = 'coding everybody'; function inner(){ alert(title); } inner(); } outter();
- 위 예제를 살펴보면 내부함수와 외부함수 지역변수는 다음과 같다.
내부함수 function inner(){ alert(title); } 외부함수의 지역변수 var title = 'coding everybody';
- 내부함수에서 title이라는 지역변수가 존재하지 않을 경우 javascript에서는 내부함수(inner) 바깥쪽에서 title이라는 변수를 찾게된다. 그래서 내부함수의 title 값은 외부함수의 지역변수 값을 가져와서 coding everybody를 출력하게 된다.
즉 내부함수는 외부함수 지역변수에 접근 할 수가 있고, 이러한 것을 클로저 라고한다.
function outter(){ var title = 'coding everybody'; return function(){ alert(title); } } var inner = outter(); inner();