실행컨텍스트

nabisorry·2019년 12월 24일
0

1. 실행 컨텍스트

컨텍스트란? 사용자가 함수를 호출할 때 내부적으로 함수의 정보들을 가져오는 것 즉 코드의 실행 환경이다.
처음 웹브라우저가 자바스크립트를 읽으면 전역 컨텍스트가 생긴다. 이후 자바스크립트는 함수 컨텍스트를 따라 함수가 실행될 때마다 새로운 컨텍스트가 생기고 함수가 종료되면 그에 해당하는 컨텍스트가 종료된다. 해당 페이지를 닫거나 이동하면 전역 컨텍스트가 종료된다.

컨텍스트에는 4가지 규칙이 있다.
1.앞서 설명한 함수컨텍스트
2.컨텍스트 생성 시 컨텍스트 안에 변수객체(arguments, variable), scope chain, this가 생성됩니다.
3.컨텍스트 생성 후 함수가 실행되는데, 사용되는 변수들은 변수 객체 안에서 값을 찾고, 없다면 스코프 체인을 따라 올라가며 찾습니다.
4.함수 실행이 마무리되면 해당 컨텍스트는 사라집니다.(클로저 제외)

var a = 1; // 1.변수선언 3. a=1 할당
function outer() { // 2.함수 선언과 할당
   console.log(a); // 6. 실행 (1)

   function inner() { // 5.함수 선언과 할당
      console.log(a);   // 9. 실행 (undefiend)) 
      var a = 2;    // 8.변수 선언 10. a=2 할당
   } 

   inner();     // 7. 함수실행(inner컨텍스트열림)

   console.log(a); // 11. 실행(1)
} 
outer(); // 4.함수실행(outer컨텍스트열림)
console.log(a); //12.실행(1)

1.전역컨텍스트 생성 argument=없음 , variable=a,outer , scope chain=전역자체 , this =window
2.outer컨텍스트열림 argument=없음 , variable = inner , scope chain = [전역 > outer] , this = window
3.inner 컨텍스트 열림 argument=없음 , variable = a , scope chain = [전역 > outer > inner] , this = widow

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

앞서 공부했던 렉시컬 스코프를 적용해서 위처럼 코드를 적어보면
outer 의 scope chain 은 [전역 > outer]이고 inner의 scope chain 역시 [전역 > inner] 가 될것이다.


참고
제로초
javascript 핵심개념알아보기

profile
쿨럭쿨럭

0개의 댓글