클로저를 공부해봤다!! - 어원편

developer.mozilla.org/ko/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript

객체지향 자바스크립트 개요

코드를 좀더 구조적으로 짜고싶어서 객체지향 자바스크립트 문서랑 기본서를 뒤적거리고있다.

 

클로저는 정보은닉과 캡슐화같은 이점을 얻게해주는 자바스크립트의 기술이다.

자바 class의 private 같은 느낌인거같다.

정보은닉을 할 필요가 없으면 굳이 클로저를 안쓰고

prototype에 메소드를 추가하는게 메모리 절약에 도움된다고 한다.

(클로저를 사용하면 인스턴스를 만들때마다 내부 함수가 딸려 오기때문이다)

 

기술 이름이 클로저인 이유는 간단히 설명 할 수있다.

 

아래 표를 한번 보고 코드에 대입해보면 더 쉽게 이해할수있다.

속박변수	함수의 인수, 지역변수	자유변수	속박변수 외 나머지 변수
닫힌함수	속박 변수'만' 갖곡있는 함수	열린함수	자유변수를 갖고있는 함수

 

//모던 자바스크립트 283p 예제
//함수 g()의 관점으로
var a = "A";
function f(){
  var b = "B";
  function g(){
    var c = "C"; 
    console.log(a+b+c); //ABC 출력
  }
  g();
}
f();

 

 

 

함수 g()의 관점으로 분류해보면 변수 c는 속박변수 변수 a,b는 자유변수 이다.

따라서 속박 변수만 갖고있는 함수 f()는 닫힌 함수(얘는 함수 f()의 관점에서 봐야됨)

변수 a,b,c를 포함하고있는 함수 g()는 열린함수 (a,b가 자유변수이기때문)가 된다.

 

속박변수	변수 c	자유변수	변수 a,b
닫힌함수	함수 f()	열린함수	함수 g()

클로저는 열린함수 g() 밖의 자유변수 a,b를 함수 g()의 속박변수처럼 써서 함수g()를 닫힌함수 꼴로 만든다.

그러니까 열린함수를 '닫힌'함수 처럼 만든다해서 Closure(폐쇄) 인것

 

 

 

다음편은 클로저 예시와 유효범위 체인을 이해하기위해 자바스크립트 실행문맥에 대해서 정리를 해볼예정이다

다다음은 클로저 구동 방법을 좀더 자세히 알기위해 유효범위 체인을 정리할거다