[JS Deep Dive] 실행 컨텍스트

실행 컨텍스트는 자바스크립트의 동작 원리를 담습니다.

소스코드의 타입

1. 전역코드

2. 함수코드

함수 내부에 존재하는 소스코드, 함수나 중첩함수, 클래스는 포함하지 않음

3. eval 코드

빌트인 전역 함수인 eval 함수에 인수로 전달되어 실행되는 소스코드

4. 모듈 코드

모듈 내부에 존재하는 소스코드

이러한 소스코드에 따라 실행 컨텍스트를 생성하는 과정과 관리 내용이 다릅니다.

1. 전역코드

• 전역 변수를 관리하기 위해 최상위 스코프인 전역 스코프를 생성해야 합니다.
• 전역 변수와 전역 함수를 전역 객체의 프로퍼티와 메서드로 바인딩하고 참조하기 위해 전역 객체와 연결되어야 합니다.
• 전역 코드가 평가되면 전역 실행 컨텍스트가 생성됩니다.

2. 함수코드

• 지역 스코프를 생성하고 지역 변수, 매개변수, 인수 객체를 관리해야 합니다.
• 생성한 지역 스코프를 전역 스코프에서 시작하는 스코프 체인의 일원으로 연결해야 합니다.
• 함수 코드가 평가되면 함수 실행 컨텍스트가 실행됩니다.

3. eval 코드

• 엄격 모드에서 자신만의 독자적인 스코프를 생성합니다.

4. 모듈 코드

• 모듈별로 독립적인 모듈 스코프를 생성합니다.

소스코드의 평가와 실행

소스코드는 실행에 앞서 평가 과정을 거칩니다. 이는 코드를 실행하기 위한 준비입니다.

1. 소스코드 평가

• 실행 컨텍스트 생성
• 변수 함수 등의 선언문 먼저 실행
• 실행 컨텍스크가 관리하는 스코프에 이를 등록

2. 소스코드 실행

• 선언문을 제외한 소스코드가 순차적으로 실행
  런타임 시작
• 변수나 함수의 참조를 스코프에서 검색하여 취득
• 값의 변경과 같은 코드 실행 결과는 실행 컨텍스트가 관리하는 스코프에 등록

실행 컨텍스트의 역할

1. 전역 코드 평가

• 전역 코드를 실행하기 위한 준비
• 선언문 먼저 실행
  • 변수
  • 함수
• 변수와 함수 전역 스코프에 등록
• 전역 변수와 함수는 전역 객체의 프로퍼티와 메서드

2. 전역 코드 실행

• 전역 코드가 순차적으로 실행
• 전역 변수에 값이 할당, 함수가 호출됨
• 함수가 호출되면 전역 코드의 실행을 일시 중단하고 코드 실행순서를 변경하여 함수 내부로 진입

3. 함수 코드 평가

• 함수 호출에 의해 코드 실행 순서가 변경되어 함수 내부로 진입 시, 함수 코드 평가 과정 거침
• 함수 코드 실행 준비
• 매개변수와 지역 변수 선언문이 실행
• 매개변수와 지역 변수가 실행 컨텍스트가 관리하는 지역 스코프에 등록
• 인수 객체가 생성되어 지역 스코프에 등록됨
• this가 바인딩됨

4. 함수 코드 실행

• 함수 코드 순차적 실행
• 매개 변수와 지역 변수에 값 할당
• 코드가 실행되려면 스코프를 구분하여 식별자와 바인딩된 값이 관리되어야 합니다.
• 중첩 관계에 의해 스코프 체인을 형성하여 식별자를 검색할 수 있어야 하며, 전역 객체의 프로퍼티도 전역 변수처럼 검색할 수 있어야 합니다.
• 함수 호출 종료 시, 함수 호출 이전으로 되돌아감
  • 현재 실행중인 코드와 실행하던 코드 구분하여 관리
  • 스코프, 식별자, 코드 실행 순서 등의 관리 필요

실행 컨텍스트는 소스코드를 실행하는데 필요한 환경 제공하고 코드의 실행 결과를 실제로 관리하는 영역입니다.

그리고 식별자를 등록하고 관리하는 스코프와 실행 순서 관리를 구현한 내부 메커니즘입니다.

모든 코드는 실행 컨텍스트에 의해 실행되고 관리됩니다.

식별자와 스코프는 렉시컬 환경으로 관리되며, 코드 실행 순서는 실행 컨텍스트 스텍으로 관리됩니다.

실행 컨텍스트 스택

• 전역 코드 평가하여 전역 실행 컨텍스트 생성

• 함수 호출시 함수 코드 평가 및 함수 실행 컨텍스트 생성

• 이 때, 실행 컨텍스트는 스택 자료구조로 관리됩니다.

  • 실행 컨텍스트 스택

    전역 코드 → 함수 스택 실행 → 내부 함수 스택 실행 및 복귀 → 함수로 복귀 → 전역으로 복귀

  • 최상위에 존재하는 실행 컨텍스트는 언제나 현재 실행 중인 코드의 실행 컨텍스트 입니다.

    실행 중인 실행 컨텍스트

렉시컬 환경

• 식별자와 식별자에 바인딩된 값, 상위 스코프에 대한 참조를 기록하는 자료구조입니다.

• 실행 컨텍스트를 구성하는 컴포넌트
• 실행 컨텍스트 스택은 코드 실행 순서 관리
• 렉시컬 환경은 스코프와 식별자 관리
• 키와 값을 갖는 객체 형태의 스코프를 생성
  • 식별자를 키로 등록
  • 식별자에 바인딩된 값을 관
  • 식별자를 등록하고 관리하는 곳
• Lexical 환경 컴포넌트
  • 초기 하나의 동일한 렉시컬 환경 참조
• Variable 환경 컴포넌트
  • 초기 하나의 동일한 렉시컬 환경 참조
  • 상황을 만나면 새로운 렉시컬 환경 생성
    • 이로 인해 컴포넌트의 내용이 달라짐

1. 환경 레코드

• 스코프에 포함된 식별자를 등록하고 등록된 식별자에 바인딩된 값을 관리하는 저장소
• 소스코드의 타입에 따라 관리하는 내용이 다릅니다.

2. 외부 렉시컬 환경에 대한 참조

• 상위 스코프를 가리킴
• 외부 렉시컬 환경, 즉 실행 컨텍스트를 생성한 소스코드를 포함하는 상위 코드의 렉시컬 환경
• 외부 렉시컬 환경 참조를 통해 단방향 링크드 리스트의 스코프 체인 구현

참고 : 모던 자바스크립트 Deep Dive(이웅모) 교재를 참고하여 정리하였습니다.