자바스크립트 실행 컨텍스트(Execution context)

실행 컨텍스트란?

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

실행 컨텍스트의 종류

• 전역 실행 콘텍스트
  : 어떤 함수에도 포함되지 않는 코드는 전역 실행 컨텍스트에 속함.
  자바스크립트 기본이 되는 컨텍스트
• 함수 실행 컨텍스트
  : 함수 내에 존재하는 코드
• eval 함수 실행 컨텍스트
  : eval 함수내에서 실행된 코드

콜 스택(call stack)

: 자바스크립트 엔진이 원시타입 값과 함수 호출의 실행 컨텍스트를 저장하는 곳

실행 컨텍스트는 언제 만들어지나?

: 함수가 호출될 때 만들어진다.
함수를 호출하면 그 함수 안에 변수를 관리하고, 코드를 실행하는 환경이 필요한데 이때 새로운 실행 컨텍스트를 만든다.

function greeting() {
	let name = '조';
    console.log('안녕' + name);
}

greeting(); // 이 함수 호출시 실행 컨텍스트가 만들어짐

실행 컨텍스트의 역할

1. 전체 코드의 환경 순서를 보장
   : 동일한 환경에 있는 코드를 실행할 때 필요한 환경 정보를 모아 객체를 구성& 이를 콜스택에 쌓아올림 & 가장 위에 쌓여있는 컨텍스트와 관련 있는 코드를 실행
2. 실행 컨텍스트가 활성화되는 시점에 선언된 변수를 hoisting
3. 외부 환경 정보 구성
   : 현재 실행 중인 함수가 외부의 어떤 변수에 접근할 수 있는지 체크
4. this 값 설정
   : this가 가리키는 객체가 무엇인지 정의

스택 구조

함수를 호출할 때 실행 컨텍스트 스택에 실행 컨텍스트를 차곡차곡 쌓는다. 순서대로 함수를 실행하는 구조를 갖는다.

function first() {
  console.log("First 함수");
  second();
}

function second() {
  console.log("Second 함수");
  third();
}

function third() {
  console.log("Third 함수");
}

first();

1. first()가 호출되면 first 함수의 실행 컨텍스트가 스택에 쌓인다.
2. second()가 호출되면 second 함수의 실행 컨텍스트가 그 위에 쌓인다.
3. third()가 호출되면 third 함수의 실행 컨텍스트가 그 위에 또 쌓인다.

이렇게 함수가 호출될 때마다 스택에 쌓였다가, 종료되면 스택에서 제거되는 방식으로 작동