[JS]Closure

let x = 10;
function outer() {
  console.log(x); // ReferenceError // outer 안에 새로운 x가 잇고 console.log의 위치는 새로운 x의 할당보다 먼저 위치하고 있기 때문에..?
  let x = 20;
  console.log(x); // 20
  function inner() {
    x = x + 20;
  }
  inner();
}

outer();
let result = x;
console.log(result); // 10

let x = 10;
function outer() {
  console.log(x); // 10
  x = 20;
  console.log(x); // 20
  function inner() {
    x = x + 20;
  }
  inner();
}

outer();
let result = x;
console.log(result); // 40

Closure

함수를 리턴하는 함수

현재 상태를 기억하고 변경된 최신 상태를 유지하는 것

함수와 함수가 선언된 어휘적(lexical) 환경의 조합 이 환경은 클로저가 생성된 시점의 유효 범위 내에 있는 모든 지역 변수로 구성됨

1. 클로저를 통해 커링(currying, 함수 하나가 n개의 인자를 받는 대신 n개의 함수를 만들어 각각 인자를 받게 하는 방법),
2. 클로저 모듈(변수를 외부 함수 스코프 안쪽에 감추어, 변수가 함수 밖에서 노출되는 것을 막는 방법) 등의 패턴

return function () {
  box.style.display = isShow ? "block" : "none";

  isShow = !isShow;
};