코어 스코프, 스코프 체인, 외부환경참고

어쩌면 이 모든게 클로저를 위한 학습이 아닐까?..

 

# 식별자

 

식별자란 유효범위

 

a 외부에서 선언한 변수는 외부뿐 아니라 a 의 내부에서도 접근이 가능하지만 

a 내부에서 선언한 변수는 오직 a 내부에서만 접근 가능

 

es5 까지의 자바스크립트는 전역공간을 제외하면 오직 함수 스코프만 생성 됨

 

식별자의 유효범위, 스코프를 안에서 바깥으로 차례로 검색해나가는 것을 스코프 체인이라 함,

이를 가능하게 하는 것이 바로 어휘적 환경(렉시컬환경)의 두번째 수집 자료인 외부환경참조이다.

 

복습

 

실행컨텍스트의 수집 정보

 

환경변수(Variable Enviroment) 와 렉시컬환경은 모두 환경레코드와 외부환경참조를 갖는다.

환경변수의 환경레코드와 외부환경참조는 최초 실행 스냅샷을 저장하고

렉시컬환경은 그 이후에 변경사항을 저장한다.

 

환경레코드는 컨텍스트를 구성하는 식별자, 함수등을 처음부터 끝까지 순서대로 수집 === 호이스팅

---

ㅅ

스코프체인 예제 )

 

외부환경참조를 활용한 순서

 

루틴

전역컨텍스트 실행 -> 실행 컨텍스트 실행 -> 환경레코드 등록/저장 -> 환경레코드에서 탐색 -> 없으면 외부환경참조

 

1. 환경레코드에 a , outer() 저장

2. 10번 줄에서 outer() 실행컨텍스트 실행 -> 2번 줄로 이동 함수 실행

3. 환경레코드에 inner() 저장

4. 외부환경참조로 실행컨텍스트 공간 Global 과 그 공간의 식별자를 저장 [ Global, {a, outer}]

5.  7번째 줄 inner() 함수 실행

6. 환경레코드에 a 를 저장

7. 외부환경참조로 실행컨텍스트 공간 outer() 와  그 공간의 식별자를 저장 [ outer, { inner} ]

8. inner() -> conosole.log(a) a는 지금 식별자는 있으나 값을 찾으려니 없다 undefined 출력

9. var a = 3 a에 3을 할당

10. inner() 함수 종료, 실행컨텍스트 콜 스택에서 제거되고 7번째 줄로 이동

11. 7번째 줄 console.log(a) 를 해보니 환경레코드에도 가진게 없어서 외부환경으로 이동해서 찾는다.

12. 외부환경에는 a 라는 식별자에 1이 할당되있는 걸 발견하고 가져옴

13. outer() 함수 종료, 실행컨텍스트 콜 스택에서 제거

14. 11번째 줄 console.log(a) 전역컨텍스트의 환경레코드에 a를 검색하면 1이라는 값이 바로 찾을 수 있음,

15. 모든 코드 실행 종료, 전역 컨텍스트가 콜 스택에서 제거되고 종료

다른 예제)

 

1. 전역 컨텍스트 실행 환경레코드에 a와 outer를 저장, 외부환경참조는 없음,

2. a에 1을 할당하고 outer() 에 함수를 할당

3. 9번째 줄 outer() 함수 실행

4. 전역 컨텍스트가 중단되고 outer() 함수 실행컨텍스트가 실행

5. outer 환경 레코드에 b 와 inner, 외부환경참조로 [ Global, {a, outer} ] 등록

6. b에 2를 할당, inner에 함수 할당

7. inner() 함수 실행

8. outer 실행컨텍스트가 중단되고 inner() 실행컨텍스트가 실행

9. inner 환경 레코드에 등록 x, 외부환경참조로 [outer, { b, inner} ] 등록,

10. conosle.dir(inner) 실행,

11. inner 환경레코드에 등록된 것이 없으므로 외부환경으로 이동해서 탐색(스코프체인)

12. inner를 발견 inner() 를 출력,

13. inner() 함수종료, 실행컨텍스트 콜 스택에서 제거

14. outer() 함수종료, 실행컨텍스트 콜 스택에서 제거

15. 모든 코드 종료, 전역컨텍스트 콜스택에서 제거되고 종료,

 

this 맛보기

function test () {
	
    let a = 0;
    
    function b () {
    	
      console.log(this.test) // f test()
      
    }
    b()
}
test()

실행 컨텍스트의 환경레코드, 외부환경참조 외에도 thisBinding 이라는게 있다.

this 로 지정 된 객체가 저장되고, 실행컨텍스트 활성화 당시에 this가 지정되지 않은 경우 this에는 전역 객체가 저장 됨,

 

그 밖에 함수의 호출 방법에 따라 this에 저장되는 대상이 다름.