실행 컨택스트란?
실행할 코드에 필요한 환경 정보를 모아놓은 객체입니다.
실행 컨텍스트는 콜 스택(Call Stack)에 쌓이며 스택의 최상단 컨텍스트와 관련된 코드가 실행됩니다.
컨텍스트는 전역 공간, eval() 함수, 함수 실행 등으로 생성됩니다.
함수 실행은 가장 일반적인 실행 컨텍스트 생성 방식입니다.
콜 스택(Call Stack)은 코드의 실행 순서를 관리하는 메모리 구조입니다.
스택(Stack):
출입구가 하나뿐인 데이터 구조로 "후입선출(LIFO)" 방식으로 동작합니다.
데이터를 a, b, c 순으로 넣으면 꺼낼 때는 c, b, a 순으로 나옵니다.
스택이 가득 찼을 때 데이터를 더 넣으려 하면 "스택 오버플로우" 에러가 발생합니다.
큐(Queue):
양쪽이 열린 파이프처럼 동작하며 "선입선출(FIFO)" 방식으로 동작합니다.
데이터를 a, b, c, d 순으로 넣으면 꺼낼 때도 동일한 순서로 나옵니다.
실행 컨텍스트와 콜 스택
var a = 1;
funtion outer() {
funtion inner() {
console.log(a); // undefined
var a = 3;
}
inner();
console.log(a);
}
outer();
console.log(a);전역 실행 컨텍스트의 시작
자바스크립트 파일을 브라우저에서 실행하면 전역 실행 컨텍스트가 자동으로 생성됩니다. 전역 컨텍스트는 자바스크립트 코드의 최상단 환경으로 파일이 열리는 순간 콜 스택(Call Stack)에 담깁니다.
전역 컨텍스트는 특별한 실행 명령 없이도 자동으로 활성화되며 실행 가능한 다른 코드(함수 호출 등)가 등장하기 전까지 순차적으로 전역 코드가 실행됩니다.
함수 호출과 실행 컨텍스트의 추가
자바스크립트에서 함수가 호출되면 새로운 실행 컨텍스트가 생성됩니다. 이 컨텍스트는 해당 함수 실행에 필요한 환경 정보를 포함하며 콜 스택의 맨 위에 쌓입니다.
function outer() {
function inner() {
let a = 3;
console.log(a);
}
inner();
console.log('outer done');
}
outer();-
outer()함수가 호출되면 outer 실행 컨텍스트가 생성되어 콜 스택에 추가됩니다. -
outer()내부에서inner()함수가 호출되면 inner 실행 컨텍스트가 콜 스택의 맨 위에 쌓입니다. -
inner()실행이 종료되면 inner 실행 컨텍스트는 콜 스택에서 제거되고 다시 outer 실행 컨텍스트가 활성화됩니다. -
마지막으로
outer()실행이 끝나면 outer 실행 컨텍스트도 제거됩니다.
중단과 재개, 그리고 종료
새로운 실행 컨텍스트가 추가되면 이전에 실행되던 코드는 중단됩니다.
스택의 맨 위 컨텍스트가 실행을 끝내면 중단되었던 아래 컨텍스트로 돌아갑니다.
마지막으로 전역 코드까지 모두 실행되면 콜 스택이 비어 있는 상태로 종료됩니다.
콜 스택의 구조와 흐름
콜 스택은 "스택(Stack)" 자료구조로 동작하며 후입선출(LIFO) 방식으로 작동합니다.
가장 최근에 추가된 실행 컨텍스트가 먼저 실행되고 실행이 끝나면 제거됩니다.
VariableEnvironment: 현재 컨택스트 식별자들에 대한 정보 + 외부 환경 정보.
선언 시점의LexicalEnvironment의 스냅샥으로, 변경 사항은 반영되지 않음
LexicalEnvironment: 처음에는VariableEnvironment와 같지만 변경 사항이 실시간으로 반영됨.
ThisBinding: 식별자가 바라봐야 할 대상 객체
VariableEnvironment
VariableEnvironment와 LexicalEnvironment 모두 내부에 environmentRecord와 outerEnvironmentReference로 구성됩니다.
실행 컨텍스트 생성 시 초기에는 동일한 정보를 가집니다.
VariableEnvironment는 실행 초기 상태의 스냅샷을 유지합니다.
이후 코드 실행 중에는 주로 LexicalEnvironment가 사용되며 값은 코드 진행에 따라 업데이트됩니다.
실행 컨텍스트 생성 시 VariableEnvironment에 정보가 담기고 이를 복사하여 LexicalEnvironment가 생성됩니다.
코드 실행이 진행되면서 두 환경이 달라질 수 있습니다.
