😶 자바스크립트 면접 단골 개념들 3 (클로져)

[leemember]

❇️ 클로져 (=폐쇄, 닫히는 느낌)

• 자바스크립트에서 클로저란 콤비네이션이다. 바로 함수와 그 외부를 둘러싸고있는 렉시컬 환경의 조합이라고 볼 수 있다. 쉽게 말해 이너함수에서 그 외부에 있는 함수의 스코프에 접근할 수 있는 것을 클로저라고 한다.

function outer() {
  const x = 0;
  function inner() {
   x; // 감싸고있는 함수의 변수에 접근이 가능하다. 이유는 클로저 때문
  }
  inner();
}
outer();

이런 함수가 있다고 본다면, 실행 컨텍스트 스택에 전역 스코프 렉시컬 환경이 먼저 들어오고 그 다음에 outer 스코프 렉시컬 환경이 들어온다. 그래서 outer 렉시컬 환경 안에 Inner 스코프가 들어오게 된다.

함수 내부에서도 외부에 있는 스코프에 접근할 수 있다.

const text = 'hello';

function func() {
 console.log(text);
}

func(); // 'hello'

이렇게 내부에서 외부의 접근이 가능하다.

참고자료 : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures

[leemember]

• 클로저는 내부 정보를 은닉하고, 공개 함수(public, 외부)를 통한 데이터 조작을 위해 쓰인다.
• 캡슐화와 정보은닉을 위해 쓴다.
• 클래스 private 필드 또는 메소드를 사용하는 효과와 동일하다.

function makeCounter() {
  let count = 0;
  function increase() {
   count++; // 외부에 있는 0을 참조한다.
   console.log(count);
 }
  return increase;
}

const increase = makeCounter();

increase();
increase();
increase();