deep to 클로저

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

☞ 자신을 포함하고 있는 외부 함수가 생명주기를 다하더라도 해당 외부함수의 매개변수와 변수들을 접근할 수 있다.

 

이게 무슨 말이냐하면 지역-렉시컬 스코프라는 개념에 의해서는 변수의 생명주기는 {}에 의해 정해지는데 해당 함수가 호출되어 실행이 끝난 뒤에도 실행중인 내부함수에 의해 그 함수의 변수가 살아 있을 때 그 내부함수를 클로저라고 부른다.

const add = ()=>{

  let level = 1

  console.log(level)

  level++

}                            // add 함수의 실행주기 die

add() // 1

add() // 1

 

위의 예제를 보면 알 수 있듯이 add 함수의 지역-렉시컬 스코프에 따라 생명주기가 끝나면 level이라는 변수는 G.C에 의해 쓰레기통에 버려지고 level은 add() 함수가 다시 불려지면서 1로 초기화된다. 그래서 add()를 몇번을 호출하더라도 변하지 않는다.(즉 add() 내부에 있는 level이라는 변수는 죽었다 살았다를 반복한다.)

이렇듯 변수는 지역-렉시컬 스코프에 의해 생명주기를 다해야하는데 해당 스코프가 끝나도 그 변수값을 참조 카운트로 인해 G.C가 버리지 않아 남아있게 되는 경우가 있는데 이러한 경우를 만드는 것이 바로 클로저다.

 

const addMaker = ()=>{

  let level = 1

  const add = ()=>{

    level ++

  }

  const get = ()=>{

    return level

  }

  return {add, get}

}

const{add,get}=addMaker()

add() // 2

add() // 3

const level = get()  // level = 3 

 

이제 이 예제를 보자. addMaker() 함수는 {}블록이 닫히는 순간 생명주기를 다하지만 add라는 함수가 참조되는 코드가 있기 때문에 add함수에 의해서 참조되어지는 level은 G.C가 버리지 않는다. 그러므로 addMaker 함수는 죽었으나 level은 add()와 get()이 다할 때까지 참조 카운트에 의해 살아있게 되는 것이다. 이때 add와 get을 클로저라고 한다.

 

'자바스크립트 핵심가이드'에서는 유효범위(스코프)를 설명하고 이어서 클로저를 설명하면서 '좋은 소식 하나는 내부 함수에서 자신을 포함하고 있는 외부 함수의 매개변수와 변수들을 접근할 수 있다는 것(this와 arguments는 예외)'이라고 했다. 즉 클로저를 잘 활용함으로써 스코프로 인한 제한사항을 극복할 수 있다는 것으로 이해된다.