(기본/기초) Javascript 클로저, Javascript closure, 자바스크립트 클로저

 

 

웹 개발을 공부하면서 사실 기본을 처음부터 익히지 않고 무작정 달려들었던 것 같다.

원리와 기본 개념이 없어도 쉽다고 생각한 것이 자바스크립트였는데...막상 몇몇 기본적인 현상과 마주치고 나니.. "이건 버그야!" 라고 생각하는 경우도 종종 있었다.

 

아무튼, 클로저라는 개념을 모르고 사용한 코드가 아래처럼 종종 있었다.

function hi(name) {
  var _name = '안녕! ';  //클로저~
  return function() {
    console.log(_name + ', ' + name);
  };
}
var mm = new hi('world');
mm();

위 경우를 살펴보면 _name으로 선언한 변수는 앞에 var가 붙었음에도 불구하고 글로벌하게 사용되지 않는 것을 볼 수 있다.

즉, 내가 무슨짓을 하던지 간에 _name으로 선언한 변수에 접근 할 수 없는 것 이다.

 

 

여러 좋은내용의 글들을 살펴보면, 클로저형태의 변수를 선언하면 내부 변수가 차지하는 메모리를 자체적으로 회수 해 가지 않는다고 한다. 아까 코드를 조금 더 써 보면,

function hi(name) {
  var _name = '안녕! ';  //클로저~
  return function() {
    console.log(_name + ', ' + name);
  };
}
var mm = new hi('world');
mm();

var mm2 = new hi('worlds');
mm2();

//아래처럼 널을 줘서 클로저의 참조를 제거해야된다고 한다.
mm = null;  
mm2 = null;

 

클로저라는 개념은 특정함수 내부에서 지속적으로 살아있는 값을 의미하며, 외부에서 접근하거나 임의로 바꿀 수 없는 값을 의미 한다.