스코프(Scope)? 클로저(Closure)란?

#스코프란?📌

스코프란 변수 이름, 함수 이름, 클래스 이름과 같은 식별자가 본인이 선언된 위치에 따라 다른 코드에서 자신이 참조될 수 있을지 없을지 결정되는 것 이다.

전체 코드는 전역과 지역으로 구분할 수 있으며, 변수가 전역에서 선언되면 전역스코프를 받게 되고, 지역에서 선언되면 지역스코프를 갖게 된다.

이때 각 위치에서 변수를 참조할 때, 자바스크립트 엔진은 스코프 체인을 통해 변수를 참조한다.
스코프 체인과 스코프 체이닝의 설명은 아래의 링크에서 확인 가능하다.
실행 컨텍스트? 호이스팅? 스코프 체이닝이란?

#클로저란?📌

내부함수가 이미 생명주기를 마감한 외부함수(outer)의 변수를 참조할 수 있다면 그 함수를 클로저라고 한다.
아래의 코드를 보자

const a = 1;
const outer = () =>{
	const a = 10;
    const inner = () =>{
    	console.log(a);
    };
    return inner;
};
const Jeongwoo = outer();
Jeongwoo();

위의 코드를 실행하면 정우는 outer함수에게 중첩함수 inner를 반환받는다. 그런데 outer함수는 inner를 반환하면서 생명주기가 마감되고 이에 실행컨텍스트가 Call Stack에서 제거가 된다. 그러면 outer안에 지역변수 a또한 사라지게 되고, 코드결과는 당연히 전역변수 a 를 출력한 1이 나와야 할 것 같다.
하지만 실제로는 10이라는 값이 나오게 되는데, 이것은 inner함수가 클로저가 되었기 때문이다.
이것은 outer함수의 실행컨텍스트는 사라지지만 렉시컬 환경까지는 사라지지 않았기 때문이다.
즉 중첩함수(내부함수)가 상위 스코프의 식별자를 참조하고 있고, 본인이 외부함수보다 더 오래 살아있다면 이것은 클로저이다.

#REFERENCE

[10분 테코톡] 🍧 엘라의 Scope & Closure