✅ 실행 컨텍스트란?
실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아 놓은 객체이다.
자바스크립트는 어떤 실행 컨텍스트가 활성화되는 시점에 호이스팅이 일어나고, 외부 환경 정보를 구성하고, this의 값을 설정하는 동작을 수행한다.
👉 스택과 큐
- 스택 : 출입구가 하나뿐인 깊은 우물 같은 데이터 구조이다. 비어 있는 스택에 순서대로 데이터 a, b, c, d를 저장했다면 꺼낼때는 d, c, b, a순으로 꺼내야 한다.
- 큐 : 큐는 양쪽이 모두 열려있는 데이터 구조이다. 보통은 한쪽은 입력만 다른 쪽은 출력만 담당하는 구조를 갖고 있다. 이 경우에는 a, b, c, d를 저장했다면 꺼낼때도 a, b, c, d의 순서대로 꺼내야 한다.
스택에는 컨텍스트가 쌓이고, 실행 컨텍스트는 함수가 호출될 때마다 생성되며 해당 함수의 실행에 필요한 정보를 담고 있다. 여기에 담기는 정보는 아래와 같다.
- VariableEnvironment : 현재 컨텍스트 내의 식별자들에 대한 정보 + 외부 환경 정보 (❗️변경사항은 저장되지 않음)
- LexicalEnvironment : 처음에는 VariableEnvironment와 같지만 변경 사항이 실시간으로 반영됨.
- ThisBinding : this 식별자가 바라봐야 할 대상 객체
1️⃣ VariableEnvironment
VariableEnvironment에 담기는 내용은 LexicalEnvironment와 같지만 최초 실행 시의 스냅샷을 유지한다는 점이 다르다. 실행 컨텍스트를 생성할 때 VariableEnvironment에 정보를 담고 그대로 복사해 LexicalEnvironment를 만들고 이후에는 LexicalEnvironment를 주로 활용한다.
2️⃣ LexicalEnvironment
Variable환경과 Lexical환경의 내부는 environmentRecord와 outer-EnvironmentReference로 구성되어있다.
💡 environmentRecord
- 현재 컨텍스트와 관련된 코드의 식별자 정보들을 저장
- 매개변수명, 변수의 실별자, 선언한 함수의 함수명
- 호이스팅이 발생 (선언부만)
✅ 함수 선언문과 함수 표현식
- 함수 선언문 : function 정의부만 존재하고 별도의 할당 명령이 없는 것
- 함수 표현식 : 정의한 function을 별도의 변수에 할당하는 것
- 실질적인 차이
- 함수 선언문은 함수 전체를 호이스팅하지만 함수 표현식은 변수 선언부만 호이스팅한다.- 함수 선언문은 동일한 변수명에 서로 다른 값을 할당하면 나중에 할당한 값이 먼저 할당한 값을 덮어씌운다. -> 디버깅 어러움 🥹
- 상대적으로 함수 표현식이 더 안전하다.
💡 outer-EnvironmentReference
연결리스트의 형태를 띈다. 선언시점의 Lexical환경을 계속 찾아 올라간다. 또한 오직 자신이 선언된 시점의 Lexical환경을 참조하고 있으므로 가장 가까운 요소부터 차례대로 접근할 수 있다.
✅ 스코프 체인
자바스크립트는 전역공간을 제외하면 오직 함수에 의해서만 스코프가 생성된다.
스코프는 변수의 유효범위를 말한다.
식별자의 유효범위를 안에서부터 바깥으로 차례대로 검색해나가는 것을 스코프 체인이라고 한다.
여러 스코프에서 동일한 식별자를 선언한 경우 무조건 스코프 체인 상 가장 먼저 발견된 식별자에만 접근 가능하다.
3️⃣ ThisBinding
this로 지정된 객체가 저장된다.
this 내용 정리는 클릭 (링크 추가 예정)
