코어 자바스크립트 05_클로저

eunseo·2021년 4월 8일

JavaScript

코어 자바스크립트

목록 보기

5/5

코어 자바스크립트 05_클로저

✔ 5-1 클로저란? ✍

MDN에서는 클로저는 함수와 그 함수가 선언될 당시의 lexical environment의 상호관계에 따른 현상 선언 될 lexical environment는 outerEnvironmetReference에 해당한다.
내부함수에서 외부 변수를 참조하는 경우 선언될 당시의 lexical environment의 상호관계가 성립

◽ 5-1-1 외부 함수의 변수를 참조하는 내부 함수

var outer = function(){
  var a=1;
  var inner = function(){
    console.log(++a);
  };
  inner();
};

outer();

inner함수 내부에서는 a를 선언하지 않았기 때문에 environmentRecord(ER)에서 값을 찾지 못하므로 outerEnvironmentReference(OER)에 지정된 상위 컨텍스트인 outer의 LexicalEnvironment에 접근해서 다시 a를 찾는다. 따라서 a가 2로 출력된다.

outer 함수의 실행 컨텍스트가 종료되면 lexicalEnvironment(LE)에 저장된 식별자(a,inner)을 지운다. 그러면 각 주소에 저장돼 있던 값들은 자신을 참조하는 변수가 없게 되므로 가비지 컬렉터의 수집 대상이 된다. => outer 함수의 실행 컨텍스트가 종료되면 inner함수를 호출 할 수 없음.

var outer = function(){
  var a=1;
  var inner = function(){
    return ++al
  };
  return inner;
};

var outer2 = outer();
console.log(outer2()); //2
console.log(outer2()); //3

inner 함수의 실행 컨텍스트의 ER에는 수집할 정보가 없다. 반면, OER에는 inner함수가 선언된 위치의 LexicalEnvironment가 참조복사된다. inner함수는 outer함수 내부에서 선언되었으므로, outer 함수의 LexicalEnvironment가 담길 것이다.

클로저란 어떤 함수 A에서 선언한 변수 a를 참조하는 내부함수 B를 외부로 전달할 경우 A의 실행컨텍스트가 종료된 이후에도 변수 a가 사라지지 않는 현상이다.

✔ 5-2 클로저와 메모리 관리 ✨

클로저는 메모리 누수의 위험이 있다. 관리법만 잘 파악해서 적용하면 문제는 없다.

var outer =(function(){
  var a=1;
  var inner = function(){
    return ++a;
  };
  return inner;
}();
            
console.log(outer());
console.log(outer());

outer=null; // outer식별자의 inner 함수 참조를 끊음

관리 방법은 간단하다. 클로저는 어떤 필요에 의해 의도적으로 함수의 지역변수를 메모리를 소모하도록 함으로써 발생한다. 그렇다면 그 필요성이 사라진 시점에는 더는 메모리를 소모하지 않게 참조 카운트를 0으로 만들면 된다.

참조 카운트를 0으로 만드는 방법은?
식별자에 참조형이 아닌 기본형 데이터(보통 null, undefined)를 할당하면 된다.

✔ 5-3 클로저 활용

◽ 5-3-1 접근 권한 제어(정보 은닉)

var outer =(function(){
  var a=1;
  var inner = function(){
    return ++a;
  };
  return inner;
}();
  
var outer2 = outer();            
console.log(outer2());
console.log(outer2());

outer 함수를 종료할 때 inner 함수를 반환함으로써 outer 함수의 지역변수인 a의 값을 외부에서도 읽을 수 있게 됨. 이처럼 클로저를 활용하면 외부 스코프에서 함수 내부의 변수들 중 선택적으로 일부의 변수에 대해 접근 권한을 부여할 수 있음. 외부에서는 오직 outer 함수가 return 한 정보에만 접근할 수 있다.

◽ 5-3-2 부분 적용 함수

부분 적용 함수란 n개의 인자를 받는 함수에 미리 m개의 인자만 넘겨 기억시켰다가, 나중에 n-m개의 인자를 넘기면 비로소 원래 함수의 실행 결과를 얻을 수 있게 하는 함수이다.

eunseo

backend developer

이전 포스트

코어 자바스크립트 05_클로저