JavaScript

스코프 체인 예시

whoyoung90 2021. 12. 25. 16:40
반응형

실행 컨텍스트 LexicalEnvironment 수집 정보는

 

- enviornmentRecord (변수정보 수집)(호이스팅)

- outerEnvironmnetReference (스코프 체인) (선언될 당시의 LexicalEnvironment를 참조)

 

"var a = 3"의 유무에 따라서 스코프체인 값이 바뀌는 예시를 기록해보고자 한다.

 

1) 4번째 줄이 undefined인 이유

inner의 environmentRecord에 a가 "있기때문에" undefined 출력 (아직 할당된 값은 없어서 undefined)

var a = 1;
var outer = function() {
  var inner = function() {
    console.log(a); // undefined
    var a = 3;
  };
  inner();
  console.log(a); // 1
};
outer();
console.log(a); // 1

 

전역스코프 - enviornmentRecord: { a, outer }

                  - outerEnvironmnetReference: X

 

outer스코프 - enviornmentRecord: { inner }

                    - outerEnvironmnetReference: GLOBAL { a, outer }

 

inner스코프 - enviornmentRecord: { a }

                    - outerEnvironmnetReference: OUTER { inner }

 

2) var a = 3 삭제 시, 4번째 줄이 1인 이유

inner의 environmentRecord에 a가 "없기때문에"  상위 스코프로 올라가서 찾는다 => 1출력!

var a = 1;
var outer = function() {
  var inner = function() {
    console.log(a); // 1
    // 삭제
  };
  inner();
  console.log(a); // 1
};
outer();
console.log(a); // 1

 

전역스코프 - enviornmentRecord: { a, outer }

                  - outerEnvironmnetReference: X

 

outer스코프 - enviornmentRecord: { inner }

                    - outerEnvironmnetReference: GLOBAL { a, outer }

 

inner스코프 - enviornmentRecord: X

                    - outerEnvironmnetReference: OUTER { inner }

 

 

 

반응형