자바스크립트 - 클로저 (closure)

클로저 (closure)

---

클로저는 함수와 Lexcial 환경의 조합이다.

함수가 생성될 때의 외부 변수를 기억하는 것이다. 생성 후에도 그 변수에 접근 가능하다.

 

 

자바스크립트는 변수에 함수를 담을 수 있다는 것을 알 것이다.

const x = sub(5);

그런데 그 함수의 반환값이 익명함수라면?
x라는 변수에 익명함수가 저장되며, 인수로 넘긴 5는 sub 함수의 내부 Lexical 환경에 등록된다. (a=5)
x함수를 호출했을 경우 x함수 안에 a란 변수는 없으므로 sub 함수의 내부 Lexical 환경에서 참조해온다.

function sub(a){        → 5)a=5를 가져옴
    return function(b){ → 3)b=10으로 인자를 받음
      return a-b;       → 4)a가 없으니 상위 함수에서 참조해옴.
    }
  }
const x = sub(5);       → 1)변수 x에 익명함수를 저장, a=5
x(10)                   → 2)익명함수 function(10)를 호출한 것.

→ 6)결과는 5-10 = -5

function plusOne(){
  let a = 0
  return function(){
    return a++;
  };
}
let p = plusOne(); → 익명함수를 저장
p();               → 0
p();               → 1
p();               → 2

 

어휘적 환경(Lexical Environment)

자바스크립트는 코드를 차례로 실행하며 내려가면서 Lexcial 환경에 등록된 변수를 초기화/할당한다.

1. 함수 밖에서 변수를 선언하면 전역 Lexical 환경에 등록된다.
   
   
2. 함수를 만나면 내부 Lexical 환경이 생성되고, 지역 변수는 내부 Lexcial 함수에 등록된다.
   내부 Lexcial 환경는 전역 Lexical 환경을 참조한다.
   함수 내에서 변수가 호출되면 내부 Lexcial 환경에 변수가 있는지 확인하고 없다면 전역 Lexical 환경을 참조하여 변수가 있는지 확인한다.
   내부 Lexcial 환경 →(참조)→ 전역 Lexical 환경
   
   
3. 함수 안에서 익명 함수를 만드는 경우 익명함수 Lexcial 환경이 생성된다.
   익명함수 Lexcial 환경는 상위 함수의 내부 Lexical 환경을 참조한다.
   익명 함수 내에서 변수가 호출되면 익명함수 Lexical 환경에 변수가 있는지 확인하고 없다면 상위 함수의 내부 Lexical 환경을 참조하여 값을 가져온다. 이것이 바로 클로저다.
   익명함수 Lexcial 환경 →(참조)→ 내부 Lexcial 환경 →(참조)→ 전역 Lexical 환경