클로저란 무엇인가요?

클로저를 이해하기 위해선 스코프 체인, 렉시컬 환경에 대한 이해가 선행되어야 한다.

 

차근차근 이해해보자.

 

스코프 체인

JavaScript에서 변수를 검색하는 메커니즘

 

JavaScript에서는 함수나 블록 내에서 특정 변수를 참조하고자 할 때

 

현재 스코프부터 상위 스코프로 해당 변수를 검색해나가는데, 이러한 과정을 스코프 체인이라고 한다.

 

예를 들어 아래와 같은 코드의 경우

const globalColor = 'red'

function func1() {
  const func1Color = 'blue'

  function func2() {
    const func2Color = 'green'

    console.log(func2Color)
    console.log(func1Color)
    console.log(globalColor)
  }

  func2()
}

func1()

 

아래와 같은 스코프 체인이 발생한다.

 

즉 func2 함수의 각 console.log 문에서

 

func2Color는 현재 스코프를, func1Color는 상위 스코프를, golbalColor는 전역 스코프를 참조하는 것이다.

 

렉시컬 환경

스코프 체인을 구성하는 기본 단위

 

위 스코프 체인을 자세히 보면 global environment, func1 environment, func2 environment로 이루어져 있고

 

각각의 environment는 environment record와 outer environment reference로 구성된다.

 

이때 environment들을 렉시컬 환경이라 하고 렉시컬 환경은 환경 레코드와 외부 환경 참조로 구성된다.

 

환경 레코드는 현재 스코프에서 선언된 변수와 함수를, 외부 환경 참조는 상위 스코프에 대한 참조를 나타낸다.

 

즉 함수는 자신이 호출되면 렉시컬 환경을 바탕으로 함수 내부 코드를 실행하는데, 예시로 확인해보자.

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

outerFunc()

 

innerFunc이 호출되면 innerFunc은 렉시컬 환경의 외부 환경 참조를 확인하고 outerFunc environment에서 x를 참조한다.

 

이런 예시도 확인해보자.

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

const inner = outerFunc()
inner()

 

앞선 예시와 달리 inner이 호출되면 innerFunc이 호출되지만,

 

이미 outerFunc이 콜스택에서 제거되었기 때문에 outerFunc environment의 x를 참조할 수 없을 것이다.*

 

그러나 실제로 코드를 실행시켜보면 10이 출력되는데, 여기서 클로저가 사용된다.

 

* JavaScript는 함수 실행 시 콜스택에 함수를 push하고, 함수 실행 완료 시 pop한다. 이를 통해 한 번에 하나의 함수만 실행할 수 있으며 이때 콜스택은 컨텍스트 스택이라고도 한다. 위 예시의 경우 inner 호출 시점에서는 outerFunc이 이미 pop된 이후이므로 원래는 outerFunc environment를 참조할 수 없다.

 

클로저

함수와 그 함수가 선언되었을 때의 렉시컬 환경과의 조합

 

쉽게 설명하면 클로저는 함수의 렉시컬 환경을 기억하는 함수, 방법, 메커니즘 등을 의미한다.

 

위 예시에서도 클로저를 사용해 innerFunc이 자신의 렉시컬 환경을 기억할 수 있었기 때문에

 

outerFunc이 콜스택에서 제거되었음에도 outerFunc environment의 x를 참조할 수 있었던 것이다.

 

일반적으로 innerFunc과 같은 함수를 내부 함수, outerFunc과 같은 함수를 외부 함수라고 한다.

 

클로저는 외부 함수의 실행이 끝나 외부 함수가 소멸된 이후에도 내부 함수가 외부 함수에 접근하고 참조할 수 있도록 한다.

 

이러한 클로저는 함수 내부에 변수를 선언하고 접근 가능한 스코프에서만 접근 가능하도록 제한하므로

 

일반적으로 데이터를 은닉하고 보호해야 하는 경우 사용된다.

 

 

 

 

 

---

다음 자료를 공부하여 정리한 글로, 아직 많이 부족해 틀린 내용이 있을 수도 있습니다.

 

혹시 있다면 댓글로 알려주세요. 수정하고 더 공부해나가겠습니다-

 

클로저

클로저 끝장 정리