Skip to content

Latest commit

 

History

History
179 lines (117 loc) · 6.63 KB

(10.10)Execution_context.md

File metadata and controls

179 lines (117 loc) · 6.63 KB

Execution Context

실행 컨텍스트

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

  • 실행 컨텍스트는 실행 가능한 코드 블럭이 실행되는 환경

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

  • 실행에 필요한 정보

    • 변수
    • 매개변수
    • 함수 선언
    • 변수의 유효범위
    • this

  • 코드가 실행되면, 실행 컨텍스트 스택 생성하고 소멸한다.

  • 실행 중인 컨텍스트에서 관련 없는 컨텍스트가 실행되면 새로운 컨텍스트가 생성된다.

  • 컨텍스트는 스택에 쌓이고, 컨트롤(제어권)이 이동한다.

    1. 논리적 스택 구조를 가지는 컨텍스트 스택 생성
    2. 스택은 LIFO 나열 구조
    3. 전역 코드로 컨트롤이 들어가면 "전역 실행 컨텍스트" -> 실행 컨텍스트
    4. 전역 실행 컨텍스트는 어플리케이션 종료 때 까지 유지
    5. 함수 호출하면 해당 함수의 컨텍스트 실행
    6. 직전 컨텍스트 위에 쌓임
    7. 함수 실행 종료가 되면 실행 컨텍스트 파기
    8. 직전의 실행 컨텍스트에 컨트롤 반환

실행 컨텍스트 객체의 프로퍼티(??)

* Variable object
* Scope chain
* thisValue

Variable Object

왜 전역 컨텍스트와 함수 컨텍스트 둘다 Variable Object라고 표현하는지? 어느 것이 맞는 표현인지?

  • 실행 컨텍스트가 생성되면 자바스크립트 엔진은 실행에 필요한 정보를 담을 객체 생성

  • 코드에서는 접근할 수 없다.

  • Variable Object는 아래 정보를 담는다.

    • 변수
    • 매개변수와 인수
    • 함수 선언

  • VO는 실행 컨텍스트의 프로퍼티이다. -> 다른 객체를 가르킴

  • 전역 코드 실행시 생성되는 전역 컨텍스트의 경우와 함수를 실행할 때 생성되는 함수 컨텍스트 경우, 가리키는 객체가 다르다.

    • 이는 전역 코드와 함수의 내용이 다르기 때문
    • 전역 코드는 매개변수 X, 함수에는 매개변수 O

  • 전역 컨텍스트

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

  • 함수 컨텍스트

    • VO는 Activation Object(활성 객체)를 가리킨다.
    • 매개변수와 인수들의 정보를 "배열의 형태로 담고 있는 객체"인 arguments object가 추가된다.

Scope Chain

  • Scope Chain은 일종의 리스트로서 중첩된 함수의 스코프의 레퍼런스를 차례로 저장하고 있는 개념.
  • 현재 실행 컨텍스트의 Activation Object를 선두로 한다.
  • 마지막 리스트는 전역 객체를 가리킨다.
  • 엔진은 이를 통해 변수의 스코프를 파악한다.
  • 함수가 중첩상태일 때 하위 함수에서 상위함수의 유효범위까지 참조가능한 것은 Scope Chain을 검색하기 때문.
  • 스코프 체인은 [[scope]] 프로퍼티로 참조 가능

this value

  • this 프로퍼티에는 this값이 할당
  • this에 할당되는 값은 함수 호출 패턴에 의해 결정

실행 컥텍스트 생성 과정

Global Code에의 진입

  • 컨트롤 실행 전에 전역 객체 생성

  • 코드가 종료 될 때 라이프 사이클이 끝이 난다.

  • Built-in object와 BOM DOM이 전역 객체에 포함 된다.

  • 실행 컨텍스트를 바탕으로 이하의 처리가 실행 된다.

    1. Scope Chain의 생성과 초기화
    2. Variable Instantiation 실행
    3. this value 설정

Scope Chain의 생성과 초기화

  • 새로운 실행 컨텍스트에 들어가면 Scope Chain의 생성과 초기화 실행

Variable Instantiation 실행

  • Scope Chain의 생성과 초기화가 끝내면 Variable Instantiation 실행

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

  • Global code 경우 variable Object는 Global Object를 가리킨다.

    1. (Function code일경우) 매개변수가 Variable Object의 프로퍼티로, 인수가 값으로 set된다.
    2. 대상 코드 내의 함수 선언을 대상으로 함수명이 Variable Object의 프로퍼티로 set 된다.(함수 호이스팅)
    3. 생성된 Function Object가 값으로 set된다.(함수 호이스팅)
    4. 대상 코드 내의 변수 선언을 대상으로 변수명이 Variable Object의 프로퍼티로,
      undefined가 값으로 set된다.(변수 호이스팅)
    • 정리하면 매개변수와 인수 처리 -> 함수 호이스팅 -> 변수 호이스팅이다.

함수 foo의 선언 처리

  • 함수 선언은 variable instantiation <실행순서 2>와 같이 선언 된 함수명(foo)이 Variable Object의 프로퍼티로,
    생성된 Function Object가 값으로 바인딩된다.

  • 생성된 Function Object는 [[Scopes]] 프로퍼티를 갖는다.

    • 현재 실행 컨텍스트의 Scope Chain이 참조하고 있는 객체와 같은 객체를 참조하는 리스트 바인딩(?)

  • 지금까지는 코드가 실행 되기 이전이다.

  • 스코프 체인이 가리키는 변수 객체에 이미 함수가 등록되어 있음.

  • 이후 코드 실행할 때 함수선언식 이전에 함수를 호출할 수 있게 됨.

    • 이 것을 함수 호이스팅이라고 말함

변수 x의 선언 처리

  • 선언 단계

  • 초기화 단계

  • 할당 단계

  • var 키워드로 선언된 변수는 선언과 초기화가 한번에 이루어짐.

  • 스코프 체인이 가리키는 변수 객체에 변수가 등록되고 변수는 undefined로 초기화

    • 이때문에 선언문 이전에 변수에 접근하여도 Variable Object에 변수 존재 하므로 에러 X
    • 이 것을 변수 호이스팅이라고 함.

this value 결정

  • this의 value는 언제나 전역 객체

Global code의 실행

  • 이전까지는 코드를 실행하기 위한 환경 준비
  • 지금부터 코드의 실행

변수 값의 할당

  • 선두부터 검색하여 변수명에 해당하는 프로퍼티가 발견되면 값을 할당

함수 foo의 실행

  • foo가 실행되면 새로운 함수 실행 컨텍스트 생성

    1. Scope Chain 생성과 초기화
    2. Variable Instantiation 실행
    3. this value 결정

  • 위와 차이는 Global Code가 아니라 Function Code이다.

    • 그러므로 Funtion Code의 룰이 적용된다.

Scope Chain의 생성과 초기화

Variable Instantiation 실행

this value 결정

foo function code의 실행

  • 이제 함수 foo의 코드 블럭 내 구문이 실행

변수 값의 할당

함수 bar의 실행