실행 컨텍스트(1)

실행 컨텍스트

실행 컨텍스트는 자바스크립트가 실행될 때 생성되는 하나의 실행 단위이다. 자바스크립트에서 실행 컨택스트는 매우 중요한 개념이기 때문에 이 개념을 잘 이해하는 것이 중요하다.

콜스택와 실행 컨텍스트 개념

콜스택은 실행할 프로그램의 코드 정보를 담는 자료구조를 말한다. 함수가 호출 될 때마다 이 콜스택에 함수의 실행 정보가 하나씩 쌓이게 된다.

실행 컨텍스트는 이렇게 콜스택과 비슷하게 컨텍스트 스택 구조에 쌓이게 된다. 실행 컨텍스트는 실행 가능한 코드가 실행되기 위해 필요한 환경(실행에 필요한 기본적인 구성이 담긴 데이터)이라고 할 수 있다.

코드의 실행에 필요한 정보에는 다음과 같은 정보들이 있다.

1. 변수: 전역 변수, 지역 변수, 매개 변수, 객체의 프로퍼티
2. 함수 선언
3. 변수의 유효 범위(scope)
4. this의 바인딩 정보

즉, 자바스크립트에서는 함수를 통해 코드를 구분함으로써 각각의 "컨텍스트(문맥)"으로 구분하고, 각각의 함수가 호출될 때마다 스택에 해당 함수의 실행에 필요한 환경을 담게 된다는 말이다.

실행 컨텍스트의 형성

ECMAScript에서는 실행 컨텍스트가 형성되는 경우를 3가지로 규정하고있다.

1. 전역 코드
2. eval()가 실행될 때//매개 변수를 코드로 실행하는 함수
3. 함수를 실행할 경우

일반적인 경우에는 보통 함수를 통해서 실행 컨텍스트가 형성된다. 그리고 이 코드 블록 안에는 변수, 객체 그리고 "실행 가능한 코드"가 있다. 이렇게 실행 컨텍스트가 형성되면 해당 실행 컨텍스트는 스택의 맨 위로 들어가게 된다. 이렇게 스택의 가장 위에 있는 실행 컨텍스트가 현재 실행되고 있는 컨텍스트다. ECMAScript에서는 실행 컨텍스트의 형성을 다음과 같이 말했다.

현재 실행되는 컨텍스트에서 이 컨텍스트와 관련 없는 실행 코드가 실행되면,
새로운 컨텍스트가 생성되어 스택에 들어가고 제어권이 그 컨텍스트로 넘어간다.

이해가 됐을 수도 안됐을 수도 있지만 일단 코드를 통해서 자세히 알아보자.

위의 코드를 실행하면 코드의 실행 순서는 전역코드의 console.log() 함수 -> function2() 함수 -> function1() 함수 이다. 이를 그림으로 표현해보겠다.

먼저 코드가 실행되고 컨텍스트가 순서대로 생성된다.

이후에 함수가 종료되고 컨텍스트가 순서대로 pop되게 된다. 그리고 맨 마지막으로 전역 컨텍스트가 pop되고 프로그램이 종료된다.

실행 컨텍스트의 작동 방식을 살펴보면 다음과 같다.

1. 실행 컨텍스트 스택의 생성
2. 코드의 실행 이후 전역 코드의 실행으로 인해서 전역 컨텍스트가 생성되고, 실행 컨텍스트 스택에 전역 컨텍스트가 쌓인다.
3. 전역 코드에서 함수를 호출하면 새로운 실행 컨텍스트가 생성되고, 해당 실행 컨텍스트는 실행 컨텍스트 스택에 쌓이게 된다.
4. 함수가 종료되면 해당 실행 컨텍스트는 실행 컨텍스트 스택에서 반환(삭제)되고 바로 직전에 실행되던 컨텍스트에 제어권을 넘긴다.
5. 전역 코드가 끝나면 전역 컨텍스트가 스택에서 반환되고, 프로그램이 종료된다.