코어자바스크립트 - 실행컨텍스트

Dahee Kim·2021년 7월 6일
0

실행 컨텍스트

: 실행할 코드에 제공할 환경 정보들을 모아놓은 객체. 자바스크립트 엔진이 활용할 목적으로 생성할 뿐, 개발자가 코드를 통해 확인할 수는 없다. 실행컨텍스트에 담기는 정보는 다음과 같다.

  • VariableEnvironment: 현재 컨텍스트 내의 식별자들에 대한 정보 + 외부 환경 정보. 선언 시점의 LexicalEnvironment의 스냅샷으로, 변경사항은 반영되지 않는다.
  • LexicalEnvironment: 처음에는 VariableEnvironment와 같지만 변경사항이 실시가능로 반영됨
  • ThisBinding : this 식별자가 바라봐야할 대상 객체

실행컨텍스트를 구성하는 방법

  • 전역공간(자동생성), eval()함수, 함수

실행컨텍스트와 콜스택

var a = 1;
function outer() {
	function inner(){
    	console.log(a); //undefined
        var a = 3;
    }
	inner();
    console.log(a);	 //1
}
outer();
console.log(a);		//1

콜스택?

[] -> [전역컨텍스트] -> [outer, 전역 컨텍스트] -> [inner, outer, 전역 컨텍스트] -> [outer, 전역컨텍스트] -> [전역컨텍스트] -> []

활성화된 실행 컨텍스트의 수집정보

inner함수의 실행컨텍스트

VariableEnvironment
- environmentRecord(snapshot)
- outerEnvironmentReference(snapshot)
LexicalEnvironment
- environmentRecord
- outerEnvironmentReference
ThisBinding

VariableEnvironment

  • LexicalEnvironment와 담기는 내용은 같지만, VariableEnvironment는 최초 실행시의 스냅샷을 유지한다. 실행 컨텍스트를 생성할 때 VariableEnvironment에 정보를 먼저 담은 다음, 이를 그대로 복사해서 LexicalEnvironment를 만들고, 이후에는 주로 LexicalEnvironment를 활용.
  • VariableEnvironment와 LexicalEnvironment의 내부 구조는 environmentRecord + outer-EnvironmentReference로 되어있다.

LexicalEnvironment (번역 : 어휘적 환경, 정적 환경, 사전적 환경)

  • '현재 컨텍스트 내부에는 a,b,c와 같은 식별자들이 있고 그 외부 정보는 D를 참조하도록 구성되어 있다'라는, 컨텍스트를 구성하는 환경 정보들을 사전에서 접하는 느낌으로 모아놓은 것.
  • 본인의 이해가 아닌, 타인과 커뮤니케이션을 위해서는 원어(Lexical) 그대로 사용하는 것이 좋다.

EnvironmentRecord와 호이스팅

EnvironmentRecord에는 현재 컨텍스트와 관련된 코드의 식별자 정보들이 저장된다. 컨텍스트 내부 전체를 처음부터 끝까지 쭉 훑어나가며 순서대로 수집한다.

  • 컨텍스트를 구성하는 함수에 지정된 매개변수 식별자
  • 선언한 함수가 있을 경우 그 함수 자체
  • var로 선언된 변수의 식별자

전역 실행 컨텍스트

  • 변수 객체를 생성하는 대신 자바스크립트 구동환경이 별도로 제공하는 객체(전역객체)를 활용.
  • 전역객체 : 브라우저의 window, Node.js의 global 등이 있다. 이들 객체는 자바스크립트 내장 객체가 아닌 호스트 객체로 분류된다.

호이스팅

  • 실행 컨텍스트가 관여할 코드가 실행되기 전에 자바스크립트 엔진은 이미 해당 환경에 속한 코드의 변수명 등을 모두 알고있게 된다. 따라서 '자바스크립트 엔진은 식별자들을 최상단으로 끌어올려놓은 다음, 실제 코드를 실행한다.'라고 생각하더라도, 코드를 해석하는데에는 문제될 것이 없다 ! 여기서 등장하는 개념이 바로 호이스팅이다. (끌어올리다 hoist + ing)
  • 변수 정보를 수집하는 과정을 더욱 이해하기 쉬운 방법으로 대체한 가상의 개념. 자바스크립트 엔진이 실제로 끌어올리지는 않지만, 편의상 끌어올린 것으로 간주

호이스팅 규칙

42-47p. 예시 둘러보면 좋아요

profile
하루가 너무 짧아~

0개의 댓글