Muscardinus
Lexical Environment 본문
Lexical Environment?
Lexical Environment란 JS Engine이 현재 읽고 있는 코드의 Scope 혹은 Environment를 말한다. 새로운 Lexical Environment는 괄호({})가 있을 때 마다 생성된다. Execution Context가 JS Engine에게 현재의 Lexical Environment를 알려주는 역할을 하고, 이에 맞게 사용할 수 있는 변수를 결정한다. Lexical Environment는 쉽게 생각해서 하나의 새로운 세계라고 생각하면 된다.
function one() {
var isValid = true; // local env
two(); // new execution context (새로운 세계)
}
function two() {
var isValid; // undefined
}
var isValid = false; // global
one();
Scope Chain
자신의 Lexical Scope 밖으로 연결할 수 있는 연결고리를 Scope Chain이라고 한다. Scope Chain은 부모의 Environment의 변수들에 접근 할 수 있는 역할을 해준다.
function sayMyName() {
var a= "a";
return function findName() {
var b = "b";
console.log(a);
return function printName() {
var c = "c";
console.log(a,b);
}
}
}
sayMyName()()();
위 코드에서 볼 수 있듯이, 함수는 부모의 container에 있는 변수들에만 접근할 수 있다. 자식이 부모의 변수를 접근 할 수 있지만, 부모가 자식의 변수에 접근 할 수 없다. 추후에 배울 class의 상속과도 비슷한 개념이라고 생각해도 좋다.
Function And Block Scope
대부분의 언어는 Block Scope 으로 되어있다. 무슨 뜻이냐면, 새로운 괄호가 생기면, 또 하나의 Lexical Environment가 생긴다는 것이다. 하지만, JavaScript는 본질적으로 Function Scope으로 되어있다. 따라서 괄호가 아닌, Global Scope에서 function이 있는 곳에서만 새로운 Local Environment를 만든다.
그렇다면 Block Scope는 JS에서 없는 것 일까? 그것은 아니다!
그렇지 않다!
ES6에서는 Block Scope을 위해서 let 과 const를 JS에서 만들었다.
// Function Scope
function loop() {
for (var i = 0; i < 5; i++) { console.log(i); }
console.log("final", i);
}
// Block Scope
function loop2() {
for (let i = 0; i < 5; i++) { console.log(i); }
// console.log("Final2", i); // Error
}
loop();
loop2();
해당 코드를 보면 알 수 있듯이, let 을 사용하면 괄호 안에서 새로운 Block Scope가 생성된다. 이에 따라 for 문 밖에서는 i를 접근할 수 없다.
Let And Const
변수 선언에 있어서 let 과 const는 var와 조금 다르게 작동한다. Execution Context가 생성되면, JS Engine은 그 Scope 안에 있는 var 변수에 memory를 할당해주고, undefined로 값을 초기화 해 준다. 반면, let과 const는 코드 상으로 실행되는 구간에서 초기화된다. 따라서 코드 상으로 실행되는 구간 전에 값을 호출하면 Error가 발생한다.
'FrontEnd > JavaScript Basics' 카테고리의 다른 글
Higher Order Functions (0) | 2020.12.17 |
---|---|
Prototype (0) | 2020.12.17 |
Hoisting (0) | 2020.12.16 |
Execution Context (0) | 2020.12.15 |
Static Vs Dynamic Typed (1) | 2020.12.15 |