JavaScript/실행 컨텍스트

Trooper·2022년 8월 4일
0

JavaScript

목록 보기
10/13
post-thumbnail
post-custom-banner

실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체 로서 자바스크립트의 동작원리를 알려줍니다.
컨텍스트는 문맥으로 코드의 실행 환경이라고 이해하면 편합니다.
스택 큐
stack 자료구조로서 call Stack 이라고도 부릅니다. push pop 후입선출 맨 위의 stack이 현재 실행 코드라 할 수 있다.
stack 은 우물, queue 는 파이프라 생각 하면 편합니다.

실행 컨텍스트

// 전역 객체 생성
// 전역 코드 평가 =>  x: undefined , foo : undefined
// 전역 코드 실행 => x : 'kim', foo : func
// 1 Stack 전연 컨텍스트 생성

var x = 'kim';

// 함수 코드 평가 => y : undefined, bar : undefined
function foo() {
  // 함수 코드 실행 => y: 'jung'
  var y = 'jung';

  // 함수 코드 평가 =>  z : undefined
  function bar() {
    // 함수 코드 실행 => z: 'jin'
    var z = 'jin';
    console.log(x + y + z); //kimjungjin
  } // bar 함수 pop (1)
  //bar 함수 호출 => bar 함수로 이동
  // 3Stack 함수 컨텍스트 생성
  bar();
} // foo 함수 pop (2)

// foo 함수 호출 => foo 함수로 이동
// 2Stack 함수 컨텍스트 생성
foo();

// 전역 컨텍스트 pop (3)
// call stack 빔

코드를 처음 실행하면 모든 것을 포함하는 전역 컨텍스트가 생깁니다.

전역 컨텍스트는 모든 것을 관리하는 환경입니다. 페이지가 종료되면 전역 컨텍스트가 사라집니다.

전역 컨텍스트 말고도 함수 컨텍스트가 있는데 함수를 호출할 때마다 함수 컨텍스트가 추가로 하나씩 생깁니다. 함수 실행이 종료되면 해당 컨텍스트는 사라진다.

자바스크립트는 함수 레벨 스코프를 따르기 때문에 함수 컨텍스트가 쌓이고 사라지는 것이다.
실행 컨텍스트 스택

call stack이란 실행 컨텍스트를 저장하는 자료구조에 stack을 이용해 실행 컨텍스트를 관리하고 새로운 컨텍스트가 스택에 쌓이고 실행준인 코드가 종료되면 해당 컨텍스트를 제거합니다.

컨텍스트틑 생성시 컨텍스트 안에 변수 객체(인수 정보(argument),변수(variable)), scope chain, this가 생성됩니다.

실행 컨텍스트는 소스코드의 실행 순서 또는 환경을 제공하는 것입니다.

실행 가능한 코드

  • 전역변수 : 일반적
  • 함수 코드 : 함수
  • Eval 코드 : strict 모드 엄격모드에서 의 코드

소스코드 생성과정

  1. 전역객체 생성

  2. 전역 컨텍스트 전역코드의 평가 과정에서 생성

  3. lexical environment 생성 외부 참조, 환경레코드

  4. 환경 레코드 객체환경 레코드, 선언적 환경 레코드

Reference

profile
Web FrontEnd Developer
post-custom-banner

0개의 댓글