[모던 JS Deep Dive] 13. Scope

스코프란

• 한정된 범위 내에서 식별자를 인식 하기 위한 수단.
• 즉, 스코프는 식별자가 유효한 범위를 말한다.
• 자바스크립트는 앤진을 통해서 컨텍스트를 파악하여 스코프를 결정한다.
• 변수 이름의 중복을 허용하게 해준다.

스코프의 종류

• 전역 스코프: 어디서든 참조 가능한 컨택스트.
• 지역 스코프: 제한된 컨텍스트. 자바스크립트에서는 모든 코드블럭에서의 스코프를 인식하지 않고, 함수 레벨의 스코프만 컨택스트로 이해한다.

스코프 체인

• 자바스크립트 엔진은 하위 스코프에서 상위 스코프로 리터럴을 검색한다.
• 렉시컬 환경(Lexical Environment)이란 맵을 만들고, 변수 식별자를 이 자료구조에 키로 등록한다.
• 렉시컬 환경을 단방향 연결이 되어 있기 때문에, 하위 스코프에서 상위 스코프로 검색이 이루어진다.

랙시컬 스코프

• 대부분의 언어가 채택하고 있는 체이닝 방식
• 상위 스코프를 결정하는 방식이 두가지가 있음: 종적 스코프, 렉시컬 스코프
• 함수가 어디서 호출되었는지가 중요하지 않고, 어디서 정의 되었는지가 체이닝을 결정하는 것이 렉시컬 스코프

var x = 1;

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

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

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

위 예제를 보면, foo와 bar가 모두 전역 스코프에 정의 되어있다. 그래서, foo() 안에서 x를 재정의하고 bar()를 호출해도, bar()가 전역 컨텍스트 안에 존재하기 때문에, foo()는 1을 출력하게 되는 것이다.

아! 그리고 이 모든 내용은 var를 사용했을때 해당되는 내용이다. const나 let 같은 경우는 블록 스코프도 적용이 되는 내용이라 따로 추후에 다루어 보겠다.