JavaScript - 렉시컬 환경(Lexical Environment)

1. 렉시컬 환경이란

렉시컬 환경 - 스크립트 전체, 실행중인 함수, 코드블록 등은 자신만의 렉시컬 환경을 갖는다. 렉시컬 환경은 환경레코드, 외부렉시컬 환경으로 구성된다.

2. 환경 레코드

환경 레코드 - 렉시컬 환경에서 모든 지역 변수를 property로 저장하고 있는 객체이다. this 함수일 경우 매개 변수도 포함된다.

function add(a, b) {
	let name = 'Pete' 
}

add()

환경레코드에 {name: 'Pete', a: undefined } 이런식으로 저장되어 있다.

3. 외부 렉시컬 환경

현재 렉시컬 환경보다 더 상위의 렉시컬이다. 스크립트는 최상위 렉시컬 환경이며, 스크립트 내에 호출된 함수나 코드블록은 외부 렉시컬 환경으로 스크립트 렉시컬 환경을 참조한다.

4. 외부 렉시컬 환경을 참조하는 과정

렉시컬 환경이 만들어질 때 Environment라는 숨김 property가 만들어진다. property에는 외부 렉시컬 환경이 저장되어 있으며, 지역내에서 참조할 값이 없을 경우 property에 접근하여 외부 렉시컬 환경을 참조하게 된느데 값이 없을 경우 최상위 렉시컬 환경까지 검색하는 체이닝 과정이 일어난다. 즉, 모든 함수는 클로저라고 할 수 있다.

5. 함수는 선언이 아닌 실행될 때 렉시컬 환경을 구성한다.

함수 호출을 변수에 할당한후 호출시 하나의 렉시컬 환경이 만들어 진다. 변수로 할당 후 호출 하였기에 같은 외부 렉시컬 환경을 참조된다.
변수에 저장해두지 않고 같은 함수를 호출할 시 고유 렉시컬 환경으로 호출한 수 만큼의 렉시컬 환경이 생성되고 각각 서로다른 외부 렉시컬 환경을 참조한다.

function makeCounter() {
  let count = 0;

  return function() {
    return count++;
  };
}

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

console.log(makeConter()()); // 0
console.log(makeConter()()); // 0
console.log(makeConter()()); // 0