Java Script | 클로저

목차

1. 클로저에 대해서 아나요? 🌊🌊
   자신을 포함하고 있는 외부함수보다 내부함수가 더 오래 유지되는 경우, 외부 함수 밖에서 내부함수가 호출되더라도 외부함수의 지역 변수에 접근할 수 있는 함수
2. 클로저를 사용하면 뭐가 좋죠? 🌊
   상태를 안전하게 변경하고 유지하기 좋다.

클로저

1. 클로저에 대해서 아나요?

• 함수의 렉시컬 스코프를 기억하여 함수가 렉시컬 스코프를 벗어난 외부 스코프에서 실행될 때에도 자신의 렉시컬 스코프에 접근할 수 있게 해주는 것

• 자신을 포함하고 있는 외부함수보다 내부함수가 더 오래 유지되는 경우, 외부 함수 밖에서 내부함수가 호출되더라도 외부함수의 지역 변수에 접근할 수 있는 함수

  * 렉시컬 스코프 : 쉽게 말해서, ‘선언 시점의 상위 스코프’

  //클로저 X
  function foo() {
    var a = 1;
    function bar() {
      console.log(a); //1
    }
    bar();
  }
  foo();
  
  //클로저 O
  function foo() {
    var a = 1;
    function bar() {
      //  ← 내부 함수 bar()가 자신을 감싸고 있는 외부 함수 foo()를 벗어나 완전히 독립적인 스코프에서 실행되었을 경우 = 클로저
      console.log(a); //1
    }
    return bar;
  }
  const baz = foo();
  baz();
  

2. 클로저를 사용하면 뭐가 좋죠?

• 상태(state)를 안전하게 변경하고 유지하기 위해 사용 (상태가 의도치 않게 변경되지 않도록 상태를 안전하게 은닉하고 특정 함수에게만 상태변경을 허용하기 위해 사용)

  • 외부에 제공하고자 하는 정보들을 모아서 return하여 내부에서만 사용할 정보들에는 접근하지 못하도록 할 수 있음
    예시

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

---

출처

클로저
클로저 원래 설명 1
클로저 추가 설명 1
클로저 추가 설명 2
도서 기초부터 완성까지, 프론트엔드(157p ~)