본문 바로가기

Language/JS Flow

[JS Flow] 실행 컨텍스트 (hoisting, scope chain)

 

Execution Context 란?


 ✔ 실행에 필요한 코드 흐름상의 배경이 되는 조건/환경

✔ 동일한 조건/환경을 지니는 코드뭉치를 실행할 때 필요한 조건/환경정보

✔ 함수 or 전역공간 👉 함수를 실행할 때 필요한 환경정보를 담은 객체

라고 대략적인 설명이 가능하다.

 

여기서, 가장 중요한 개념은 Lexical Environment인데

✔ environmentRecord

✔ outerEnvironmentReference

로 나뉘고, 각각 hoistingscope chain으로도 말할 수 있다.

 

 

 

 

environmentRecord


hoisting : 현재 문맥의 식별자 정보를 실행 컨텍스트의 맨위로 끌어올린다

 

위의 코드가 hoisting 된다면, 다음과 같다.

끌어올려진 정보 전체가 environmentRecord🌟

 

어떤 컨텍스트가 처음 실행될때, 제일 먼저 하는 일이 environmentRecord를 수집하는 것이다.

 

 

 

outerEnvironmentReference


scope chain : 현재 문맥에 관련 있는 외부 식별자 정보, 가까운곳부터 밖으로 변수를 참조해간다

 

outer에서 예를 들어보면,

outer자신의 변수, 그 다음 전역 변수에 순차적으로 접근이 가능하다.

그러나 outer의 안에 있는 inner공간의 변수에 접근이 불가능하다.

 

 

 

hoisting과 scope chain 예시


 

13. outer context 종료

14. global context에서 a 탐색 -> 1출력

결과적으로, 1 undefined 1 1 을 출력하게 된다.

 

8~10번 실행에서 a를 hoisting하고 값을 할당하지 않은 상태로 출력을 하므로 undefined이 나온다.

6, 12번 실행에서 밖으로 변수를 참조해나간다. scope chain을 확인할 수 있다.

 

 

 

 

 

'Language > JS Flow' 카테고리의 다른 글

[JS Flow] prototype  (0) 2020.04.24
[JS Flow] 클로저(closure)  (0) 2020.04.20
[JS Flow] this  (0) 2020.04.18
[JS Flow] callback함수  (0) 2020.04.18
[JS Flow] 데이터 타입  (0) 2020.04.17