Closure

이번에는 자바스크립트의 클로저에 대해서 공부해보자

Closuer

클로저는 자바스크립트뿐만이 아니라 함수형 프로그래밍언어에서 사용되는 특성이다.
클로저의 정의부터 살펴보자

클로저는 주변상태에 대한 참조와 함께 묶인 함수의 조합이다.
클로저는 함수와 그 함수가 선언되었을때의 렉시컬 환경과의 조합이다.

그동안 공부했던 개념과 비교하면 정의부터 무슨말인지 잘 모르겠다..
먼저 렉시컬 환경이라는 단어가 나왔으니 이게 무엇인지부터 한번 알아보자.

Lexical Environment

렉시컬 환경이란 우리가 자바스크립트로 코드를 실행하기 전에 실행 스코프 범위안에 생성되는 변수와 함수를 프로퍼티로 저장하는 객체이다. 함수, 코드 블록, 스크립트 전체가 이 렉시컬 환경을 가진다. 렉시컬 환경은 환경레코드와 외부 렉시컬 환경으로 나뉜다.

• 환경 레코드
  자바스크립트의 호이스팅이 발생할때, 코드가 마치 맨 위로 끌어올려진 것처럼 작동한다.
  실제로 맨 위로 끌어올려진것이 아니라 먼저 코드를 확인하며 어딘가에 기록해 놓기 때문인데, 이곳이 바로 환경 레코드이다.

• 외부 렉시컬 환경
  말 그대로 현재 생성된 렉시컬 환경을 감싸고 있는 외부 환경을 말한다.

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

outerFunc();

outerFunc 함수 내에서 x라는 지역변수가 선언/호출되었고, innerFunc라는 함수에서 외부함수 outerFunc에서 선언한 지역변수 x를 참조할수 있다.
즉, innerFunc함수의 외부 렉시컬 환경은 outerFunc의 환경레코드인 것이다.

다른 예시를 한번 더 살펴보자.

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

이전의 코드와 비슷하지만 내부함수를 반환하는 것으로 바뀐 코드이다.
inner라는 변수가 outerFunc함수를 호출하고 있는데, inner변수는 변수 x가 선언되는 스코프에 바깥에 존재하는데도 불구하고 값을 정상적으로 출력하고 있다.

바로 outerFunc함수가 선언될때, 해당 렉시컬 스코프를 기억하여 스코프 바깥에서 실행되더라도 접근이 가능하기 때문이다.
이것이 바로 Closure이다.

다시 한번 위의 정의를 보자.

클로저는 주변상태에 대한 참조와 함께 묶인 함수의 조합이다.
클로저는 함수와 그 함수가 선언되었을때의 렉시컬 환경과의 조합이다.

다시말해 클로저는 함수가 선언되었을때의 렉시컬 환경을 기억하여 그 함수의 바깥에서 호출되어도 기억한 렉시컬 환경에 접근이 가능하게 하는 것을 말한다.