[JavaScript] 렉시컬 환경, 렉시컬 스코프

자바스크립트를 이해하려면,,, 로우 레벨 영역까지 알아야 한다

자바스크립트에서 실행중인 함수 , 코드블록, 스크립트 전체는 렉시컬 환경이라 불리는 내부 숨김 연관 객체를 갖는다.

이걸 알아들으려면 일단 스코프가 무엇인지 정리해보고 넘어가야한다.

스코프(scope)?

scope 는 범위, 영역을 말하는데 JS 에서 변수나 함수가 유효한 범위를 말한다.

let x = 'jay';

function call() {
    let x = 'jake';
    console.log(x)
}

call();
console.log(x)

이렇게 했을때
call() 함수를 호출했을때 나오는 x 값과
맨 하단의 x 값은 다른 변수값을 호출 하는것을 볼 수 있는데 그 이유가 해당 변수들이 바라보는 스코프가 다르기 때문이다.
즉 스코프는 변수나 함수를 검색할 때 검색 가능한 범위라고 이해할 수 있다.

전역 스코프는 가장 최상위 스코프를 말하고 전역변수는 위의 jay 를 선언한 x 에 해당 된다.
로컬 스코프는 function call() 의 내부 환경을 말하며 해당 환경 안에 선언된 변수를 지역변수라 하며 이 지역변수는 자신이 선언된 스코프와 하위 스코프에서만 참조 가능하다. 즉 글로벌 스코프(위 코드에서 맨 하단의 console.log(x))에서는 로컬 스코프의 로컬변수(jake)를 참조할 수 없다.

함수가 중첩으로 선언된다면? 스코프도 함수와 같이 중첩에 의해 계층구조를 갖는다.
내부함수 스코프 -> 외부함수 스코프 -> 전역스코프
이렇게 모든 스코프들이 연결된 것을 스코프 체인이라고 한다.

이게 자바스크립트에서 변수를 검색하는 구조라고 할 수 있다.
자바스크립트가 동작하는 방법을 이해코자 한다면 여기서 더 로우 레벨로 들어가서 렉시컬 환경을 알아야 한다.

렉시컬 환경 객체는 두 부분으로 구성된다.

1. 환경 레코드 - 모든 지역 변수를 프로퍼티로 저장하고 있는 객체, this 값과 같은 기타 정보도 여기에 저장됨.

2. 외부 렉시컬 환경에 대한 참조 - 외부 코드와 연관됨.

참고

모던자바스크립트 DeepDive

https://ko.javascript.info/closure

https://thisiscoke.tistory.com/entry/JavaScript-%EC%8A%A4%EC%BD%94%ED%94%84-%EB%A0%89%EC%8B%9C%EC%BB%AC%ED%99%98%EA%B2%BD?category=1031612?category=1031612