더북(TheBook)

console.log 줄에서 엔진은 현재 환경에서 z를 찾지만 y를 찾기 위해 외부 환경(example 호출을 위한 환경)으로 이동해야 하고 x를 찾기 위해 두 단계를 이동해야 한다. 이 모든 것이 우리가 ClosuresInLoopsWithLet을 이해하는 데 어떻게 도움이 될까? 그 함수를 다시 살펴보자. 코드 2-6을 보자.

코드 2-6 루프 내 클로저, let으로 해결(이전과 동일)–closures-in-loops-with-let.js

function closuresInLoopsWithLet() {
    for (let counter = 1; counter <= 3; ++counter) {
        setTimeout(function() {
            console.log(counter);
        }, 10);
    }
}
closuresInLoopsWithLet();

for 루프를 실행할 때 자바스크립트 엔진은 각 루프 반복에 대해 각각 별도의 counter 변수가 있는 새 환경 객체를 생성하므로 각 타이머 콜백은 다른 counter 변수를 감싼다. 다음은 자바스크립트 엔진이 해당 루프로 수행하는 작업이다.

1. 호출에 대한 환경 객체를 만든다. CallEnvObject라고 하자.

2. ClosuresInLoopsWithLet 함수(생성된 곳, 이 경우 전역 환경)에 저장된 환경에 대한 CallEnvObject의 외부 환경 참조를 설정한다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.