클로저란?

0hyo·2021년 11월 22일
0
post-thumbnail

클로저란?

  • 함수와 함수가 선언된 어휘적 환경의 조합이다.
  • 어휘적 환경이란? 클로저가 생성된 시점의 유효범위 내에 있는 모든 지역 변수로 구성된다.
  • 외부 함수의 변수에 접근할 수 있는 내부 함수이다.
  • 외부함수는 외부함수의 지역변수를 사용하는 내부함수가 소멸될 때까지 소멸되지 않는다.

내가 이해한 클로저는 먼저 함수가 선언됐을 때 환경(스코프)를 기억한다.
즉, 함수가 생성될 당시의 외부 변수를 기억하고 환경밖에서 호출되어도 그 환경(스코프)에 접근할 수 있는 함수이다.

처음에 환경이라는 말이 잘 와닿지 않았다. 환경은 말 그대로 우리 주변의 모든것을 뜻한다. js에서도 함수가 생성될 때 환경은 주변에 변수가 있다면 그 변수는 해당 함수의 환경에 일부인것이다.
이렇게 어휘적 환경이라는 단어가 어렵게 느껴졌지만 나만의 단어로 바꾸어 생각을 해보니 클로저를 알아가는데 도움이 되어가는거 같다.

Closure를 활용해서 외부함수의 변수에 접근하는 법

function outerFn()** {
  let outerVar = 'outer';	// 외부 함수의 변수
  console.log(outerVar);

  function innerFn() {		← 클로저 함수
    let innerVar = 'inner';	// 지역 변수
    console.log(innerVar);
  }
  **return innerFn**;
}

let globalVar = 'global';	// 전역 변수

outerFn()();			// outer , inner
let innerFn = outerFn();	// outer
innerFn();			// inner

클로저 함수 안에서는 아래 변수의 접근이 전부 가능하다.

✔️ 지역 변수 innerVar

✔️ 외부 함수의 변수 outerVar

✔️ 전역 변수 globalVar

클로저는 왜 사용할까?

  • 상태유지: 현재 상태를 기억하고 변경된 최신 상태 유지
  • 전역 변수의 사용 억제: 상태 변경이나 가변데이터를 피하고 함수형 프로그래밍에서 side effect를 억제하여 오류를 피하고 안정성을 높이기 위해
  • 정보의 은닉: 클래스 기반 언어의 private 키워드를 흉내낼 수 있다.

참고
https://poiemaweb.com/js-closure
https://www.youtube.com/watch?v=tpl2oXQkGZs

profile
행동하는 프론트엔드 개발자 되어가는 중 👊 파이팅!!

0개의 댓글