JavaScript/기본

자바스크립트 - 클로저(closure)란 무엇인가?

태기의삶 2020. 7. 25. 17:17

 

 

들어가기 전에,

렉시컬 스코프(Lexical Scope)를 먼저 알고 넘어가자.

참고!

 

자바스크립트 - 렉시컬 스코프(Lexical Scope)

들어가기에 앞서, Closure(클로져)를 이해하기 위해서는 반드시 렉시컬 스코프(Lexical Scope)를 이해해야 한다. 렉시컬 스코프란(Lexical Scope)란? 함수를 어디서 호출하는지가 아니라 어디에 선언하였�

ljtaek2.tistory.com

 

클로저(closure)란 무엇인가?

클로저(closure)는 함수와 그 함수가 선언됐을 때의 렉시컬 환경(Lexical environment)과의 조합이라고 부르며,

내부 함수가 외부(enclosing) 함수 변수에 액세스(접근) 할 수 있는 자바스크립트의 기능을 말한다.

우선 예제를 먼저 보고 생각해보자.

function outerFunc() {
  var x = 10;
  var innerFunc = function () { console.log(x); };
  return innerFunc;
}

var inner = outerFunc();
inner(); // 10

예제를 보면,

  • 먼저 함수 outerFunc()를 정의하고, 그 안에 함수 innerFunc()를 정의했다.
  • 그러고 나서, 변수 inner에 함수 outerFunc()에서 반환된 함수 innerFunc()를 담고 바로 호출을 시도한다.
  • 호출 후에 10이라는 숫자가 반환되어 출력되었다.

 

여기서 의문점은 분명 함수 outerFunc()는 내부 함수 innerFunc()를 반환하고 생을 마감했다는 점이다.

그런데 outerFunc의 지역변수 x가 다시 부활이라도 한 듯 함수 innerFunc()에서 동작하고 있다.

 

그 이유는 무엇 때문인가?

그것은 바로 내부 함수 innerFunc()가 호출될 때, 외부 함수 outerFunc()의 환경(Lexical environment)을 기억하고 있기 때문이다.

즉, 클로저(closure)는 반환된 내부 함수가 자신이 선언되었을 때의 환경(Lexical environment)인 스코프를 기억하여, 자신이 선언됐을 때의 환경(스코프) 밖에서 호출되어도 그 환경(스코프)에 접근할 수 있는 함수를 말한다.

더 간단히 말한다면, 클로저는 자신이 생성될 때의 환경(Lexical environment)을 기억하는 함수라고 말할 수 있다.

그렇기 때문에 외부 함수 outerFunc()에 있는 변수 x의 값 10이 내부 함수 innerFunc() 안에 있는 console.log(x)에서 그 환경을 기억하고 10이라는 값을 출력할 수 있었던 것이다.

 

🎯 결론!

이처럼 외부 함수 밖에서 내부 함수가 호출되더라도 외부 함수의 지역 변수에 접근할 수 있다.

그 이유는 자신이 생성될 때의 환경(Lexical environment)을 기억하고 있기 때문이다.

그렇기 때문에 이러한 함수를 클로저(Closure)라고 부른다.