FUNCTION(EXECUTION CONTEXT)

FUNCTION SCOPE, EXECUTION CONTEXT

• SCOPE : 유효범위 (변수)
• 스코프는 함수가 정의될 때 결정
• EXECUTION CONTEXT : 실행되는 코드덩어리(추상적 개념)
• 실행 컨택스트는 함수가 실행될 때 생성

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

//실행결과
//1
//undefined
//1
//1

1. 위의 소스가 실행될때 전역 실행컨택스트 생성
2. 호이스팅

• 변수 a 선언
• 함수 outer 선언

3. 변수 a에 1할당
4. outer 함수 호출(호출과 동시에 outer 함수의 실행컨택스트 생성)
5. 실행컨텍스트가 실행될때 호이스팅과 this바인딩이 일어남
6. 호이스팅

• inner 함수 선언

7. 1번 console.log 실행 (변수a 를 outer 스코프에서 확인했지만 없기때문에 글로벌 스코프에서 a를 찾아 1출력)
8. inner 함수 호출(호출과 동시에 inner 함수의 실행컨택스트 생성)
9. 호이스팅

• inner 함수 안에 있는 변수 a를 선언

10. 2번 console.log 실행 (inner함수의 스코프에서 a값을 확인했을때 값이 할당은 되지 않은 상태이기때문에 undefined)
11. inner 안에 있는 변수 a에 값 3을 할당
12. 3번 console.log 실행(변수a 를 outer 스코프에서 확인했지만 없기때문에 글로벌 스코프에서 a를 찾아 1출력)
13. 4번 console.log 실행

실행컨택스트가 일어난후 호이스팅과 this바인딩이 일어난다!