위키북스의 "코어 자바스크립트(정재남)"를 읽고 나름대로 정리를 하려고 한다.

2. 실행 컨텍스트

1. 실행 컨텍스트란?

실행 컨텍스트란 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다.

실행 컨텍스트를 구성하는 방법은 다음 세가지가 있다.

  1. 자동 생성되는 전역공간
  2. eval() 함수
  3. 함수를 실행

우리는 여기서 함수를 실행하는 것 외에는 할 수 있는 것이 없다고 한다.

eval함수는 뭔지 잘 모르겠다. 안 좋다고 하는 것 같다. c언어의 goto문 같은 거랄까...

실행 컨텍스트 객체에는 어떤 코드를 실행할 때 javascript engine이 해당 컨텍스트에 관련된 코드들을 실행하는 데 필요한 환경정보들을 수집해서 실행 컨텍스트 객체에 저장한다.

  • 그래서 개발자가 코드를 통해 확인할 수 없다.
  • 여기에는 다음과 같은 세가지 정보가 담긴다.
    1. VariableEnvironment: 현재 컨텍스트 내의 식별자들에 대한 정보 + 외부 환경 정보, 선언 시점의 LexicalEnvironment의 스냅샷으로, 변경사항은 반영되지 않음
    2. LexicalEnvironment: 초기에는 VariableEnvironment와 동일하지만, 변경사항이 실시간으로 반영됨.
    3. ThisBinding: 식별자가 바라봐야 할 대상 객체.

2. VariableEnvironment

실행 컨텍스트를 생성할 때 VariableEnvironment에 정보를 먼저 담은 다음, 이를 그대로 복사해서 LexicalEnvironment를 만들고, 이후에는 LexicalEnvironment를 주로 활용한다고 한다.

VariableEnvironment와 LexicalEnvironment의 내부에는 environmentRecord와 outerEnvironmentReference로 구성되어 있다.

초기화 과정 중에는 완전히 동일하고, 이후에 변경사항이 생기면 LexicalEnvironment가 변한다고 해서 LexicalEnvironment를 자세히 알아보겠다고 한다.

3. LexicalEnvironment

3.1. environmentRecord와 호이스팅

environmentRecord에는 현재 컨텍스트와 관련된 코드의 식별자 정보들이 저장된다. 컨텍스트를 구성하는 함수에 지정된 매개변수 식별자, 선언한 함수가 있을 경우 그 함수 자체, var로 선언된 변수의 식별자 등이 있다. 컨텍스트 내부 전체를 보며 순서대로 수집한다.

자바스크립트 엔진은 사실 코드를 수행하기 전부터 어떤 변수가 지금 컨텍스트에 있는지 알 수 있다.

호이스팅이란 끌어 올린다는 뜻인데, js 엔진이 실제로 끌어 올리진 않지만, 편의상 끌어올린다고 생각하면 된다고 한다.

그래서 선언을 초반에 하지 않고 나중에 하면 undefined가 나타나기도 하고, 100번째 줄에 정의한 함수의 정의를 5000번째 줄에서 변경하면 100번째 줄의 함수 정의가 무의미해지는 상황이 벌어진다.

그래서 함수를 선언하는 방법은 되도록이면 지양하고, 지역변수를 활용해서 함수 표현식으로 함수를 사용하는 것이 바람직하다고 한다.

3.2. 스코프, 스코프 체인, outerEnvironmentReference

그냥 일반적인 스코프에 대한 이야기를 하는 것 같다.

outerEnvironmentReference는 링크드 리스트와 같은 구조라고 생각하면 된다고 한다. 그래서 무조건 스코프 체인 상에서 가장 먼저 발견된 식별자에만 접근이 가능하다.

내부 함수에서 전역함수의 변수명과 동일한 이름의 변수를 짓으면 전역 함수의 변수에 접근을 하지 못하게 되는데, 이런걸 변수 은식화(variable shadowing)이라고 한다.

크롬에서 debugger를 사용하는 방법에 대해서도 나온다.

4. this

이건 뒷장에서 자세히 다룬다고 한다.

Profile

한창헌

https://github.com/HanChangHun