Posts [JavaScript] 실행 컨텍스트
Post
Cancel

[JavaScript] 실행 컨텍스트

실행 컨텍스트

실행 컨텍스트란?

실행 컨텍스트는 scope, hosting, this, function, closure 등 동작원리를 담고 있는 자바스크립트의 핵심원리이다.

ECMAScript 스펙에 따르면 실행 가능한 코드를 형상화하고 구분하는 추상적인 개념으로, 실행 가능한 코드가 실행되기 위해 필요한 환경이라고 할 수 있다.

실행 가능한 코드

  • 전역 코드 : 전역 영역에 존재하는 코드
  • Eval 코드 : eval 함수로 실행되는 코드
  • 함수 코드 : 함수 내에 존재하는 코드

일반적으로 실행 가능한 코드는 전역 코드와 함수 내 코드이다.

자바스크립트 엔진은 실행에 필요한 아래와 같은 정보들을 알고 있어야 한다.

  • 변수 : 전역, 지역, 매개, 객체의 프로퍼티
  • 함수 선언
  • 변수의 유효범위
  • this

이와 같은 정보들을 자바스크립트 엔진은 실행 컨텍스트를 물리적 객체의 형태로 관리한다.

실행 컨텍스트의 3가지 객체

  • Variable Object(VO / 변수객체)

    실행 컨택스트가 생성되면 실행에 필요한 여러 정보를 담은 객체를 생성한다. 이를 Variable Object라고 하며 아래의 정보를 가지고 있다.

    • 변수
    • 매개변수, 인수정보
    • 함수선언

    VO는 실행 컨텍스트의 프로퍼티라서 값을 갖는데 상황에 따라 다른 값을 가리킨다. 전역코드와 함수 코드의 내용이 다르기 때문이다.

    전역 컨텍스트 VO는 유일하며 최상위에 위치하고 모든 전역변수, 전역 함수등을 포함하는 전역 객체를 가리킨다. 전역 객체는 전역에 선언된 전역 변수와 전역 함수를 프로퍼티로 소유한다

    함수 컨텍스트 VO는 Activation Object(활성객체)를 가리키며 매개변수와 인수들의 정보를 배열의 형태로 담고 있는 객체인 argument object가 추가된다

  • Scope Chain (SC)

    스코프체인은 일종의 리스트로, 전역 객체와 중첩된 함수 스코프의 레퍼런스를 차례로 저장하고 있다. 현재 실행 컨텍스트의 활성객체부터 순차적으로 상위 컨텍스트의 활성 객체를 가리키며 마지막은 전역 객체를 가리킨다.

    엔진은 스코프체인을 통해 렉시컬 스코프를 파악한다. 함수 실행중에 변수를 만나면 현재 Scope, 즉 활성객체에서 검색해보고 실패시 스코프 체인에 담긴 순서대로 검색을 이어나가면서 찾는다.

  • this value

    this 프로퍼티에는 this 값이 할당된다. this는 함수를 호출할 때 함수가 어떻게 호출되었는지에 따라 동적으로 결정된다.

    this가 어떻게 결정되는지에 대해서는 다음에 자세히 포스팅 할 예정이다.

실행 컨텍스트의 생성 과정

  1. 스코프 체인의 생성과 초기화

    스코프 체인은 전역 객체의 레퍼런스를 포함하는 리스트가 된다

  2. Variable Instantiation 실행

    Variable Instantiation는 VO에 프로퍼티와 값을 추가하는 것을 의미

    변수, 매개변수 인수정보 함수선언을 VO에 추가하여 객체화

    전역 코드의 경우 VO = GO

    1. 매개변수가 VO의 프로퍼티로 인수가 값으로 설정된다
    2. 대상 코드 내의 함수 선언을 대상으로 함수명이 VO의 프로퍼티로 생성된 함수 객체가 값으로 설정된다 ( 함수 호이스팅 )
    3. 대상 코드내의 변수 선언을 대상으로 변수명이 VO프로퍼티, undefined가 값으로 설정 ( 변수 호이스팅 )

    생성된 함수 객체는 [[scope]] 라는 프로퍼티를 갖게 된다. 이는 함수가 소유하는 내부 프로퍼티로써 함수 객체가 실행되는 환경을 가리킨다. 현재 실행 컨텍스트의 스코프 체인이 참조하고 있는 겍체를 값으로 설정, 내부 함수의 scope프로퍼티는 자신의 실행 환경과 자신을 포함하는 외부 함수의 실행 환경과 객체를 가르키는데 이때 자신을 포함하는 외부 함수의 실행 컨텍스트가 소멸해도 scope가 가리키는 외부 함수 환경은 소멸하지 않고 참조할 수 있다 ⇒ 클로저

  3. this value 결정

This post is licensed under CC BY 4.0 by the author.

[ToyProject] 카카오톡 클론 프로젝트(3)

[ToyProject] 카카오톡 클론 프로젝트(4)

Comments powered by Disqus.