자바스크립트 실행 컨텍스트

실행 컨텍스트 개념

실행 가능한 자바스크립트 코드 블록이 실행되는 환경

console.log('This is global context');

function ExContext1() {
  console.log('This is ExContext1');
};

function ExContext2() {
  ExContext1();
  console.log('This is ExContext2');
};

ExContext2();

/*
This is global context
This is ExContext1
This is ExContext2
*/

전역 실행 컨텍스트가 가장 먼저 실행되고, 이 과정에서 새로운 함수 호출이 발생하면 새로운 컨텍스트가 만들어지고 실행되며, 종료되면 반환된다.

이와 같은 과정이 반복된 후, 전역 실행 컨텍스트의 실행이 완료되면 모든 실행이 끝난다.

 

실행 컨텍스트 생성 과정

function execute(param1, param2) {
  var a = 1, b = 2;
  function func() {
    return a+b;
  }
  return param1 + param2 + func();
}

execute(3, 4);

활성 객체 생성

실행 컨텍스트가 생성되면 자바스크립트 엔진은 해당 컨텍스트에서 실행에 필요한 여러 가지 정보를 담을 객체를 생성하는데,
이를 활성 객체라고 한다.

이 객체에 앞으로 사용하게 될 매개변수나 사용자가 정의한 변수 및 객체를 저장하고, 새로 만들어진 컨텍스트로 접근 가능하게 되어 있다.

arguments 객체 생성

앞서 만들어진 활성 객체는 arguments 프로퍼티로 이 arguments 객체를 참조한다.

스코프 정보 생성

현재 컨텍스트의 유효 범위를 나타내는 스코프 정보를 생성한다.

변수 생성

현재 실행 컨텍스트 내부에서 사용되는 지역 변수의 생성이 이루어진다.

this 바인딩

마지막 단계에서는 this 키워드를 사용하는 값이 할당된다. 여기서 this가 참조하는 객체가 없으면 전역 객체를 참조한다.

코드 실행

이렇게 하나의 실행 컨텍스트가 생성되고, 변수 객체가 만들어진 후에, 코드에 있는 여러 가지 표현식 실행이 이루어진다. 

이렇게 실행되면서 변수의 초기화 및 연산, 또 다른 함수 실행 등이 이루어진다.

 

 

- 본 포스팅은 "인사이드 자바스크립트" 도서를 기반으로 작성한 글입니다.