[ 자바스크립트(JavaScript) ] 스코프 체인(Scope chain)에 대해서 알아보자

📍 스코프 체인(scope chain)에 대해서 알아보자.

scope는 식별자에 대한 유효 범위를 나타낸다. 어떤 경계 A의 외부에서 선언한 변수는 A의 외부뿐 아니라 A의 내부에서도 접근이 가능하지만, A의 내부에서 선언한 변수는 오직 A의 내부에서만 접근할 수 있다. 이러한 식별자의 유효범의를 안에서부터 바깥으로 차례로 검색해나가는 것을 스코프 체인이라고 부른다. 이때 outerEnvironmentReference는 현재 호출된 함수가 선언될 당시의 L.E를 참조하게되는데, 중요한 점은 과거 당시 선언된 시점이다.

 

다음 코드의 foo()와 bar()의 출력값은 1로 동일한데, 그 이유는 function bar가 선언된 시점의 x는 전역 변수인 x를 바라보게 된다. 즉, this처럼 함수를 어디서 호출했는지 영향을 받는 것이 아니라 함수를 어디에서 정의했는지에 따라 상위 스코프를 결정한다. 함수가 호출된 위치는 상위 스코프 결정에 어떠한 영향도 주지 않는다. 즉, 함수의 상위 스코프는 언제나 자신이 정의된 스코프다. 함수 선언문으로 정의된 bar 함수는 전역에서 정의된 함수다. 그러므로 전역 코드가 실행되기 전에 먼저 평가되어 함수 객체를 생성한다. 이때 생성된 bar 함수 객체는 전역 스코프를 기억한다. 그리고 bar 함수가 호출되면 호출된 곳이 어디인지 관계없이 언제나 자신이 기억하고 있는 전역 스코프를 상위 스코프로 사용한다.

 

var x = 1;

function foo(){
  var x = 10;
  bar();
}

function bar(){
  console.log(x);
}

foo();  // 1
bar();  // 1

reference

1. 코어 자바스크립트
2. 모던 자바스크립트 딥 다이브