자바스크립트에서 변수를 선언할 때 앞에다가 아무것도 붙이지 않은 채로 이름만 붙이면 그 값은script가 아닌 global이란 곳에 저장된다.
- 우리가 변수를 읽으려고 할 때 자바스크립트는 변수를 scope에서 찾는다 (script 내에서 찾지 못한다면 global로 가서 찾는다.)
- var로 선언하면 script가 아닌 global에 저장된다. 즉 선언부가 생략된 것처럼 취급된다.
- let으로 선언하면 Script라는 곳에 저장이 된다.
이 let으로 선언된 부분을 찾으려고 할 때, 자바스크립트에서는 마찬가지로 Scope을 통해서 변수를 찾게 되는데, 이 때 Script부터 찾으므로 let으로 선언된 변수는 Script에서 찾아볼 수 있고 그 뒤에 Global은 따로 찾아보지 않는다. (const 또한 마찬가지)
- 우리가 어디에서 실행하던지 Scope 상에 Global이 바닥에 깔려 있다. > 어디서 실행하건 글로벌에는 접근이 가능하다.
- Global이라고 불리는 이유 또한 어디서든 접근가능하다는 뜻에서 불리우는 것이며 자바스크립트는 그것을 window 객체에 저장한다.
- 하지만 예외적으로 let과 const는 Global이아닌 Script에 저장이 되기 때문에 window객체에서 찾아볼 수 없다.
- Excute Context는 Call Stack에 쌓인다.
- anonymous라고 하는 첫번째 Stack은 Script전체에 있는 코드들이 접근할 수 있는 Scope를 보여준다.
- 특정 함수를 클릭하면 그 안에 있는 코드들이 접근할 수 있는 변수들을 보여주는 Scope을 나타낸다.
-
비유를 들자면 Call Stack에 있는 하나하나의 항목이 폴더라면 그 폴더에서 접근할 수 있는 파일들을 Scope라고 할 수 있다.
-
최초로 생기는 Execute context(위 사진에서의 anonymous)는 전역에서 접근할 수 있는 Execute Context라고 해서 Global Execute Context라고 불린다.
-
그리고 함수를 위해서 만들어진 것(위 화면에서의 fn1)이 Function Execute Context라고 불린다.
-
함수안에 있다고 하더라도 키워드없이 변수의 이름을 사용하면 무조건 Global Scope로 간다
-
함수 밖이든 안이든 키워드 없이 값을 사용한다면 Global Scope으로 간다 .
-
var가 함수 안에서 실행된다면, 전역에서 선언했을 때와는 다르게 Local Scope로 들어간다.
-
Local Scope에서 찾고 Scipt Scope에서 찾다가 여기에도 없으면 Global Scope에서 찾는다. 이들은 모두 연결돼 있으며, 이를 Scope Chain이라고 한다
- 아래에서 fn2 함수에 들어갔을 때 Scope의 변화를 보자
- 아래에서 보면 Call Stack은 fn2가 쌓였지만, Scope를 확인했을 때, 본인의 부모라고 할 수도 있는 fn1의 Scope를 확인해 볼 수 없다.
-
따라서 fn2의 부모 Scope로 fn1 Scope이 설정돼 있지 않기 때문에 fn1함수 내에 선언되어있는 변수들, 가령 var v1='v1';은 fn2내에서 찾아볼 수 없다.
-
함수가 끝나면 Call Stack에서 제거가 된다. 결국 마지막에는 Global Execute Context(anonymous) 만 남게 된다.
다른 의견
- window객체로된 환경변수(old style) + lexical로 선언하는 환경변수(new style) 두가지를 합쳐서 글로벌 환경변수로 보는데, 후자가 Script라는 스코프로 분리해서 표기하는걸 말하는 거 같습니다. let 과 const는 후자이기때문에 글로벌 환경이지만 window객체에는 들어있지 않다고 하네요.
- let const는 new style이기에 old style인 global Scope에 들어가지 않고 new style인 Script Scope에 들어가게 된다
