[HUFS/GnuVil] #6 실행 컨텍스트, 스코프

실행 컨텍스트

실행 컨텍스트는 식별자(변수, 함수, 클래스..)를 등록하고 관리하는 스코프와 코드 실행 순서 관리를 구현한 내부 메커니즘으로, 모든 코드는 실행 컨텍스트(Execution Context)를 통해 실행되고 관리된다

 

실행 컨텍스트를 생성하는 소스코드의 4가지 타입

코드 평가 ~ 실행 컨텍스트 생성 ~ 코드 실행 ~ 실행 컨텍스트 반영

전역 실행 컨텍스트 / 함수 실행 컨텍스트

실행 컨텍스트는 코드 실행 순서를 스택(Stack) 자료구조로 관리한다

 

const x = 1;

function foo () {
  const y = 2;

  function bar () {
    const z = 3;
    console.log(x + y + z);
  }
  bar();
}

foo(); // 6

 

위 코드의 실행 컨텍스트 스택

식별자와 식별자에 바인딩된 값, 상위 스코프에 대한 참조는 렉시컬(Lexical) 환경으로 관리한다

 

객체 형태의 스코프를 생성해 식별자와 식별자에 바인딩된 값을 키와 값으로 관리

현재 스코프의 식별자 관리 / 상위 스코프의 렉시컬 환경과 스코프 체인으로 연결

렉시컬 환경은 함수를 어디서 호출했는지가 아닌, 어디에 정의했는지에 따라 상위 스코프를 결정한다

 

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

bar 함수에서 상위 스코프에 모두 접근 가능하지만 변수 x, y는 전역 스코프가 아닌 직전 상위 스코프인 foo 함수에서 먼저 참조한다 (스코프 체인)

 

let x = 1;

if (true) {
  let x = 10;
  console.log(x); // 10
}

console.log(x); // 1

블록 레벨 Env.Rec.가 열려 있는 동안 식별자에 바인딩된 값을 대체한다

* 실행 컨텍스트가 생기는 것이 아닌 렉시컬 환경의 일시적 덮어쓰기

 

스코프

스코프(Scope)는 모든 식별자가 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위를 뜻한다

 

전역 스코프와 지역 스코프 (함수 내부)

var x = 'global';

function foo() {
  var x = 'local';
  console.log(x); // ① local
}

foo();

console.log(x); // ② global

 이름이 같아도 식별자 결정에 따라 값이 다른데, 스코프는 식별자를 검색할 때 사용하는 규칙으로도 볼 수 있다

• lexical(static) scope = 정적 스코프: 어디서 정의했는지가 중요 (자바스크립트 해당)
• dynamic scope = 동적 스코프: 어디서 호출했는지에 따라 상위 스코프가 달라짐

 

본 내용은 위키북스의 '모던 자바스크립트 Deep Dive'를 바탕으로 작성되었습니다.