자바스크립트 엔진

머맨·2021년 3월 22일
0

Javascript

목록 보기
4/5

1. 실행컨텍스트

실행컨텍스트(Excution Context) 이하 ECscope hoisting this function closure등의 동작원리를 담고 있는 자바스크립트의 핵심원리이다.

자바스크립트 엔진은 실행가능한 코드를 만나면 그 코드를 평가해서 실행컨텍스트(Excution Context) 로 만든다. 이 실행 가능한 코드의 유형은 다음 세가지가 있다

  • 전역코드 (전역 객체 window아래에 정의된 함수를 말함)
  • 함수코드 (함수 내에 정의된 코드)
  • eval 코드 (eval함수로 실행되는 코드)

이처럼 유형을 분류하는 이유는 EC 를 초기화하는 환경과 과정이 다르기 때문이다. 이 환경과정에 대해 자세히 살펴보자.

EC스택이라는 구조로 관리 된다. 스택이란 일종의 자료구조로 데이터를 아래에서부터 쌓아 올려서 마지막으로 추가한 데이터를 먼저 꺼내는 후입선출(LIFO,last in first out) 방식으로 관리된다.

EC가 만들어지면 자바스크립트 엔진은 코드를 실행하기 위해 여러가지 정보를 수집,저장하는데 그러한 환경을 렉시컬환경 이라 한다. 구체적으로는 함수 또는 블록의 유효범위안에 있는 식별자(변수 등)와 그결괏값들을 저장하는 것이다.

자바스크립트 엔진은 시작하자마자 렉시컬 환경 타입의 전역 환경 (global EC) 를 생성한다. 여기에 전역변수함수선언문들이 위치하게 된다. 그리고 난 후 함수를 만날때 마다 함수 EC 들을 생성하며 스택에 쌓이는 구조이다. 이러한 각각의 함수EC 에도 렉시컬환경이 존재하며 closure의 원리도 여기에 기반한다.

예를 들어 다음 코드를 실행하면

var x = 'xxx';

function foo () {
  var y = 'yyy';

  function bar () {
    var z = 'zzz';
    console.log(x + y + z);
  }
  bar();
}
foo();

  1. global EC를 만들고 전역변수나 함수선언문을 위치시킨다.
  2. foo() 함수를 만나 foo() EC를 생성한다.
  3. foo() 함수를 평가 하다가 bar() 함수를 만나 bar() EC를 생성한다.
  4. 각 함수 실행이 끝나면 해당 함수의 EC를 파기하고 직전의 EC로 평가가 넘어가게 된다.

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

EC에는 실행에 필요한 정보를 형상화하고 구분하기 위해 자바스크립트 엔진은 실행 컨텍스트를 물리적 객체의 형태로 관리하는데 3가지 프로퍼티를 소유하고 있다.

  • Variable Object
  • Scope Chain
  • this Value

실행 컨텍스트가 생성되면 자바스크립트 엔진은 실행에 필요한 여러 정보들을 담을 객체를 생성한다. 이를 Variable Object(VO / 변수 객체)라고 한다. Variable Object는 코드가 실행될 때 엔진에 의해 참조되며 코드에서는 접근할 수 없다. 여기에는 변수,매개변수와 인수 정보, 함수선언(함수표현식 제외) 등이 담긴다.

profile
코맨코맨

0개의 댓글