Closure, Lexical Environment

• 함수와 그 함수가 선언된 렉시컬 환경의 조합
• 이 렉시컬 환경은 클로저가 생성된 시점에 유효한 모든 지역 변수를 포함

역할

• 데이터 은닉과 캡슐화 : 함수 내부에 변수를 숨겨 외부에서의 접근을 막을 수 있음.
• 상태 유지 : 생성될 때의 환경을 기억하기 때문에 어떤 데이터를 계속 유지할 수 있음
• 콜백 함수에서의 활용 : 비동기 작업에서 콜백 함수로 클로져를 사용하면 해당 작업이 시작될 때의 환경을 콜백이 기억하여 사용 가능

예시

function makeCounter() {
    let count = 0; // `makeCounter`의 지역 변수 `count`

    return function() {
        return count++; // 외부 함수에 있는 `count` 변수에 접근
    };
}

let counter = makeCounter();
console.log(counter()); // 0
console.log(counter()); // 1

• makeCounter의 지역변수 count, 초기값은 0
• makeCounter는 또 다른 함수를 반환, 이 반환되는 함수는 makeCounter의 지역 변수 count에 접근, count의 값을 +1 함
• makeCounter 함수가 실행되고 종료될 때, 보통은 함수 내의 지역 변수들은 사라지게 됨, 하지만 반환된 내부 함수는 count 변수에 대한 참조를 유지함(클로저의 핵심, 함수가 자신이 선언될 때의 렉시컬 환경을 기억하는 것)
• counter 변수에 할당된 makeCounter 함수가 호출될 때마다 함수는 기억된 count 변수에 접근하여 그 값을 반환한 후에 증가시킴
• 즉 클로저는 makeCounter의 count 변수를 기억하고 있으며, counter 함수가 호출될 때 마다 이 변수에 접근하고 수정, 이를 통해 count 변수의 상태가 유지되며 함수 호출 간에 연속성을 가지게 됨

렉시컬 환경

• 코드가 작성된 시점의 변수와 함수의 유효 범위(Scope)를 결정하는 환경
• 전역 렉시컬 환경 : 프로그램 전체에서 접근 가능한 변수와 함수를 포함하는 최상위 레벨의 환경, 프로그램의 시작부터 종료까지 유지되며 모든 로컬 렉시컬 환경의 외부 참조 기점이 됨
• 함수 렉시컬 환경 : 각 함수가 생성될 때 마다 만들어지는 환경, 해당 함수 내에서 정의된 지역변수, 매개변수, 내부함수 등을 포함하며 외부 렉시컬 환경(함수를 둘러싼 환경)에 대한 참조도 가짐
• 블록 렉시컬 환경 : ES6 이후의 자바스크립트에서 let과 const로 선언된 블록 범위 변수를 위한 환경, 해당 블록 내에서 선언된 변수들을 포함