23장. 실행 컨텍스트

Happhee·2021년 12월 10일
0

JS : Depp Dive

목록 보기
20/35
post-thumbnail

1. 소스코드의 타입

  • 전역코드
    • 전역 스코프 생성
    • 전역 실행 컨덱스트 생성
  • 함수코드
    • 지역 스코프
    • 지역 변수, 매개변수, arguments 객체 관리
    • 함수 실행 컨텍스트
  • eval코드
    • strict mode에서 독자적인 스코프 생성
    • eval 실행 컨텍스트
  • 모듈코드
    • 모듈별로 독립적인 모듈 스코프 생성
    • 모듈 실행 컨텍스트

2. 소스코드의 평가와 실행

  • 자바스크립트 엔진은 소스코드의 평가 + 소스코드의 실행 과정으로 나누어 처리
  • 소스코드 평가 과정
    실행 컨텍스트 생성 -> 변수,
    함수 선언문실행 -> 생성된 변수나 함수 식별자를 키로 실행 컨텍스트가 관리하는 스코프에 등록
  • 소스코드 순차적 실행
    : 런타임이 시작
//전역컨텍스트에 x가 undefined로 담기고 평가하여, x=1를 담아 실행컨텍스트에 넣기
var x;
x = 1;

3. 실행 컨텍스트의 역할

  1. 선언에 의해 생성된 모든 식별자를 스코프를 구분하여 등록하고 상태변화를 관리해야 함
  2. 스코프는 중첩 관계에 의해 스코프 체인을 형성해야 함
    즉 , 스코프 체인을 통해 상위 스코프로 이동하여 식별자를 검색
  3. 현재 실행중인 코드의 실행 순서를 변경
  • 실행 컨텍스트
    소스코드를 실행하는 데 필요한 환경을 제공하고 코드의 실행 결과를 실제로 관리하는 영역
    식별자를 등록하고 관리하는 스코프와 코드 실행 순서관리를 구현한 내부 메커니즘
    모든 코드는 실행 컨텍스트를 통해 실행되고 관리
  • 렉시컬 환경 -> 식별자와 스코프의 실행 컨텍스트 환경
  • 실행 컨텍스트 스택 -> 코드 실행 순서
// 전역 변수 선언
const x = 1;
const y = 2;

// 함수 정의
function foo(a) {
  // 지역 변수 선언
  const x = 10;
  const y = 20;

  // 메서드 호출
  console.log(a + x + y); // 130
}

// 함수 호출
foo(100);

// 메서드 호출
console.log(x + y); // 3

소스코드를 실행하는데 필요한 환경을 제공하고 코드의 실행 결과를 실제로 관리하는 영역이 실행 컨텍스트이다.
즉, 실행 컨텍스트는 식별자, 변수, 함수, 클래스 등의 이름을 등록하고 관리하는 스코프와 코드 실행 순서 관리를 구현한 것이므로, 모든 코드는 실행 컨텍스트를 통해 실행되고 관리 된다.

렉시컬 환경 이라는 것은,,,!
어떤 컨텍스트에서 쓸 변수들에 대한 정의를 말함


4. 실행 컨텍스트 스택

스택 자료구조로 관리 -> 실행 컨텍스트 스택
코드의 실행 순서를 관리하며 ,
최상위에 존재하는 실행 컨텍스트는 언제나 현재 실행 중인 코드의 실행 컨텍스트


5. 렉시컬 환경

식별자와 식별자에 바인딩된 값이며 스코프와 식별자를 관리

변경사항은 모든 렉시컬 환경에서 관리된다
Variable Environment는 변경사항이 반영되지 않는다.

  • Environment Record
    현재 컨텍스트에서 수집된 정보

  • Outer Lexical Environment Reference
    상위 스코프에 대한 참조


6. 실행 컨텍스트 생성과 식별자 검색 과정

var x = 1;
const y = 2;

function foo (a) {
  var x = 3;
  const y = 4;

  function bar (b) {
    const z = 5;
    console.log(a + b + x + y + z);
}
  bar(10);
}

foo(20); // 42

일반적으로 전역 코드에서의 this는 전역객체를 말함
외부 렉시컬 환경에 대한 참조에서 전역 실행 컨텍스트는 null이 할당

바인딩 되는 것이 없으면 전역을 바인딩

외부 렉시컬 환경에 대한 참조할때, 이미 정의되어있는것중 처음만 접근가능하며 하위로는 접근하지 못한다 -> 스코프 체인에 의한 특징이다


7. 실행 컨텍스트와 블록 레벨 스코프

let, const는 모든 코드 블록을 지역 스코프로 인저하지만, var는 오로지 함수 코드 블록만 지역스코프로 인정한다

let x = 1;

//블록 레벨
if (true) {
  let x = 10;
  console.log(x); // 10
}

console.log(x); // 1

실행컨텍스트가 새로 생성되는 것이 아니라 스코프가 형성 후 삭제됨!

profile
즐기면서 정확하게 나아가는 웹프론트엔드 개발자 https://happhee-dev.tistory.com/ 로 이전하였습니다

0개의 댓글