실행 컨텍스트

실행 컨텍스트

실행할 코드에 제공할 환경 정보를 모아놓은 객체
자바스크립트의 동적 언어로서의 성격을 가장 잘 파악할 수 있는 개념

자바스크립트는 어떤 실행 컨텍스트가 활성화 되는 시점에 선언된 변수를 위로 끌어올리고(호이스팅) 외부 환경 정보를 구성, this 값을 설정하는 등의 동작을 수행한다

이로인해 다른언어에서는 발견할 수 없는 특이한 현상들이 발생한다.

스택

출입구가 하나뿐인 깊은 우물같은 데이터 구조
비어있는 스택에 순서대로 데이터 a,b,c,d를 저장했다면, 꺼낼때는 반대로 d,c,b,a 순서로 꺼낼 수 밖에 없게된다.

큐

양쪽이 모두 열려있는 파이프
종류에 따라 양쪽 모두 입력과 출력이 가능한 큐도 있으나 일반적으로 한쪽은 입력만, 한쪽은 출력만을 담당한다. 데이터 a,b,c,d를 저장했다면 , 꺼낼때는 a,b,c,d 순서대로 꺼내야 한다.

자동으로 생성되는 전역공간과 eval을 제외하면 실행 컨텍스트를 구성하는 방법은 함수를 실행하는 방법 뿐이다.

!-- 블록에 의해서도 새로운 실행 컨텍스트가 생성된다

// ----- (1)
var a = 1;
function outer() {
  function inner() {
    console.log(a); // undefined
    var a = 3;
  }
  inner(); // ----- (2)
  console.log(a); // 1
}
outer(); // ----- (3)
console.log(a); // 1

1. (1) 처음 자바스크립트를 실행하는 순간, 전역 컨텍스트가 콜스택에 담긴다

2. (3) 자바스크립트 엔진이 outer()에 대한 환경정보를 수집해서 outer 실행 컨텍스트를 생성한 후 콜 스택에 담는다. 이제 콜스택 맨 위에는 outer가 있으니 전역 컨텍스트의 실행을 일시 중단하고 outer 컨텍스트와 관련된 코드, 즉 outer 함수의 내부 코드들을 순차적으로 실행한다.

3. (2) inner 함수의 실행 컨텍스트가 콜 스택 가장 위에 담기므로 outer 컨텍스트의 코드 실행을 일시 중단하고 inner 함수의 내부 코드를 진행.

4. inner에서 a의 값에 3이 할당되고 난 후 inner함수의 실행이 종료되면서 콜 스택에서 제거된다.

5. 중단했던 (2)의 다음줄부터 실행한다.

6. console.log로 a의 값을 출력하고 난 후 outer함수의 실행이 종료, 콜스택에서 제거된다.

7. 중단했던 (3)의 다음줄부터 실행한다.

8. console.log로 a의 값을 출력한다.

최상단의 공간은 코드 내부에서 별도의 실행 명령이 없어도 브라우저에서 자동으로 실행하므로 자바스크립트 파일이 열리는 순간 전역 컨텍스트가 활성화 된다고 생각하면 된다.