ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 클로저란 무엇일까? 간결하게 정리
    Dev/Javascript 2024. 4. 22. 23:00
    반응형

    클로저를 쉽게 이해하기 위해서는 배경지식이 필요하다.

    먼저, 실행 컨텍스트를 알아야한다.

    함수는 호출 될 때 함수의 실행 컨텍스트가 생성됐다가 실행이 끝나면 실행 컨텍스트가 종료된다.

    이때 실행 컨텍스트의 lexical environment에는 함수의 지역 변수의 정보와 이 함수의 상위 스코프의 대한 정보가 들어있다. (scope chain)


    클로저란?

    함수가 생성 될 때 주변 환경의 상태를 기억하여(lexical environment) 나중에 호출될 때 그 값에 접근할 수 있는 것을 말한다.

    예제를 보자면,

    function makeCounter() {
      let count = 0;
    
      function inner() {
        count++;
        return count;
      }
    
      return inner;
    }
    
    let counter = makeCounter();
    
    console.log(counter()); // 1
    console.log(counter()); // 2
    console.log(counter()); // 3

    이 코드에서 makeCounter 함수는 inner 함수를 정의하고, 이를 반환한다.

    inner 함수는 외부 함수인 makeCounter 함수 내에 정의되어 있지만, 외부 변수인 count에 접근할 수 있다.

    이렇게 반환된 inner 함수가 클로저이다.

    이제 counter 변수에는 inner 함수가 할당되어 있고, 이를 호출할 때마다 count 변수가 증가한다.


    정리

    클로저 (Closure) 함수는 외부 함수 밖에서 내부 함수가 호출 되더라도 외부 함수의 지역 변수에 접근할 수 있다 그 이유는 자신이 생성될 때의 환경 즉, Lexical Environment을 기억하고 있기 때문이다.

    반응형

    'Dev > Javascript' 카테고리의 다른 글

    호이스팅이란?  (0) 2024.04.22
    자바스크립트 this 이해하기  (0) 2023.04.14

    댓글

Designed by Tistory.