[JavaScript] 클로저

Jiwontwopunch·2022년 7월 31일
0

독학

목록 보기
101/102
post-thumbnail

클로저는 변수의 유효 범위를 확장하는 자바스크립트의 고유한 기능이다.

function outer(){
  var value=1234;
  function inner(){
    document.write("value= " + value + "<br>");
  }
  inner();
}
outer(); // value=1234

지역함수 inner가 실행중인 동안에는 outer 함수도 실행중이어서 value 변수가 아직 남아 있어서 위와 같이 작동한다.

function outer(){
  var value=1234;
}
outer();
document.write("value= " + value + "<br>");

outer 함수를 호출할 때 value라는 지역 변수가 생성되고 1234로 초기화되지만 이 변수는 outer가 리턴할 때 사라진다. 지역 변수의 생존 범위는 함수 내부로 국한되며 따라서 외부에서는 value 지역 변수를 읽을 수 없다.

function outer(){
  var value=1234;
  function inner(){
    document.write("value= " + value + "<br>");
  }
  return inner;
}
var outin=outer();
outin(); // value=1234

이 예제가 클로저를 잘 표현한 것이라고 할 수 있다. 클로저는 외부에서 계속 필요로 하는 지역 변수를 파괴하지 않고 남겨두는 것이다. outer 함수가 리턴하더라도 value 지역 변수를 참조하는 inner 지역 함수를 대입받은 outin이 아직 남아 있다. outin을 통해 언제든지 호출할 수 있으며 이 호출이 정상적으로 실행되기 위해서는 outer 함수를 종료해서는 안된다. outin이 남아 있는 한 inner가 실행되기 위한 환경이 유지되어야 하는 것!

클로저의 용도는 다양하다. 함수를 찍어내는 템플릿 역할을 하기도하고 중요한 정보를 숨기는 캡슐화의 수단이 되기도 한다.

0개의 댓글