클로저

실행 컨텍스트 공부를 하다가 JS의 필수 개념인 클로저에 대한 이해가 부족하다는 것을 깨닫고 급하게 찾아봤다.

클로저 ??

클로저는 JS의 고유 개념이 아니다. 함수를 일급 객체로 취급하는 함수형 프로그래밍(예 : 하스켈)에서 사용되는 중요한 특성이다.
MDN에서 찾아보니 아래와 같이 정의하고 있었다.

클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다

위에 설명을 보고 잘 모르겠어서 블로그와 모던 자바스크립트 딥다이브를 찾아봤다.

const x = 1;

function outerFunc() {
  const x = 10;
 
  funcition innerFunc() {
    console.log(x); //10
  }
  innerFunc();
}
outerFunc();

outerFunc 함수 내부에서 중첩함수 innerFunc가 정의되고 호출되었다. 이때 중첩함수 innerFunc의 상위 스코프는 외부 함수 outerFunc의 스코프다. 따라서 중첩 함수 innerFunc내부에서 자신을 포함하고 있는 외부 함수 outerFunc의 x변수에 접근할 수 있다.
만약 innerFunc 함수가 outerFunc 함수의 내부에서 정의된 중첩함수가 아니라면 innerFunc 함수를 outerFunc의 x 변수에 접근할 수 없다.

결론적으로 내가 이해한 바로는 JS에서 함수는 매개변수와 로컬 변수뿐만 아니라 외부에서 선언된 변수도 자유롭게 접근할 수 있다. 즉 클로저는 자신이 생성될 때의 환경을 기억하는 함수라고 할 수 있다.

렉시컬 스코프

렉시컬 스코프를 실행 컨텍스트 관점에서 살펴본다면
자바스크립트 엔진은 함수를 어디서 호출했는지가 아니라 함수를 어디에 정의했는지에 따라 상위 스코프를 결정한다. 이를 렉시컬 스코프라 한다.

참고 : 모던자바스크립트 딥다이브