면접 준비 겸 자바스크립트의 기초 내용인 실행 컨텍스트, 호이스팅에대해 알아보도록 하겠습니다.
실행 컨텍스트는 코드가 실행되기 위해 필요한 환경(조건이나 상태) 정보들을 모아놓은 객체입니다.
실행 컨텍스트가 생성되는 시점은 일반적으로 매 함수 호출시에 생성됩니다. 그리고 함수 호출 외에도 프로그램 실행 시 전역 컨텍스트 생성, eval() 함수 실행에도 실행 컨텍스트가 구성됩니다.
우리의 코드에서 함수가 호출되면 call stack에 실행 컨텍스트가 순차적으로 쌓이게 됩니다.
function 외부함수() {
function 내부함수() {
...
}
...
}
외부함수();
// call stack
| |
| 내 부 함 수 |
|---------------|
| 외 부 함 수 |
|---------------|
| 전 역 객 체 |
|_______________|
이렇게 쌓인 call stack의 맨 위에 있는 컨텍스트가 현재 실행 중인 컨텍스트이며, 실행 후에는 실행 컨텍스트가 파기되고, 다음 스택으로 넘어가면서 순차적으로 실행됩니다.
실행 컨텍스트의 정보에는 크게 3가지로 구성되어 있습니다.
Variable Environment
과 같은 정보를 갖고있습니다. 하지만 함수 실행 도중에 변경되는 사항이 있다면 바로 반영됩니다.Enviroment Record
에는 현재 컨텍스트 안에 있는 코드의 식별자 정보가 저장됩니다. 컨텍스트 내부를 순차적으로 수집하는데 변수명
, 선언 된 함수명
, 매개변수명
등을 수집합니다. 이 과정은 코드가 실행되기 전에 이루어지며 이를 호이스팅이라고 합니다. 호이스팅에 대한 설명은 다음 글에서 좀 더 상세히 다루도록 하겠습니다.Lexical Environment
를 참조하여 직전 컨텍스트의 식별자에 접근할 수 있도록 해줍니다. 스코프라는 개념이 등장하는데 이는 식별자에 대한 유효 범위를 나타냅니다. 현재 컨텍스트에서 식별자(ex:변수)를 찾지 못하였을 때 직전 컨텍스트에 접근하여 찾는 과정을 스코프 체인이라고 합니다.this
식별자가 바라봐야 하는 대상 객체가 저장된다.참고 사이트
자바스크립트를 모르는 친구의 고개를 끄덕이게 하기 (feat.실행 컨텍스트)
자바스크립트의 실행 컨텍스트 (Execution Context) 란?
[JS] Execution Context(실행 컨텍스트)