Execution Context & Scope

1. Execution Context (실행 컨텍스트)

실행할 코드에 제공할 환경 정보들을 모아놓은 객체입니다.

• 무슨 말인가 싶죠? javascript는 코드를 실행하기 이전에

1. 선언된 변수를 위로 끌어올리기 (Hositing)

2. 외부 환경 정보를 구성하기

3. this 값을 설정하기

👉 위와 같은 동작을 수행해요.

• 참고로, 실행 컨텍스트는 자동으로 생성되는 전역 공간과 eval을 제외하면 함수를 실행할 때 생성됩니다.

아래 그림을 통해 이해해 봅시다.

---

2. Scope (스코프)

현재 접근할 수 있는 변수들의 범위를 말해요.

• 식별자의 유효범위를 안에서 바깥으로 차례대로 검색해 나가는 것을 Scope Chain라고 합니다.

Scope Chain (스코프 체인)

• 스코프 체인을 따라 스코프를 형성하면서 현재 호출된 함수가 선언될 당시의 Lexical Environment를 참조해요.

---

잘 이해했다면..

😮‍💨 글만 읽으니 무슨 말인지 너무 어렵죠? 코드로 살펴볼까요?

var a = 1;
var outer = function () {
 	var inner = function() {
      console.log(a);
      var a = 2;
    }
    inner();
    console.log(a);
}
outer(); 
console.log(a);

콘솔에 어떤 값들이 찍힐까요?

• 정답은 undefined, 1, 1 입니다.

1. 전역 실행 컨텍스트
2. outer() 실행 시 outer 실행 컨텍스트 
3. inner() 실행 시 현재 일시중단, inner 실행 컨텍스트
4. console.log(a)는 var a가 호이스팅 되었기 때문에 undefined (아직 a=2 할당은 안되었어요.)
5. inner()에서 빠져나오면 다시 outer 실행 컨텍스트
6. console.log(a)는 var a = 1; 이므로 1
7. outer()에서 빠져나오면 전역 실행 컨텍스트이므로 1

---

그럼 스코프 체인이 참조하는 것이??

맞아요. Scope Chain에서 참조하는 것이 Lexical Environment의 outer Environment Reference입니다.

---

함수 선언문 vs 함수 표현식

함수 표현식이 함수 선언문보다 일반적으로 안전합니다.

함수 선언문은 호이스팅으로 인해 어느 곳에 있어도 실행이 가능합니다. 따라서, 의도하지 않은 곳에서 함수 선언문을 사용하게 되면 코드 전 범위에 걸쳐 영향을 미치게 됩니다.