*이 필기는 웹 프로그래밍 튜토리얼에서 보고 작성합니다.
1. 스코프란?
우리는 이를 함수에서 경험하였는데 함수의 매개변수는 함수 몸체 내부에서만 사용할 수 있고 외부에서는 사용할 수 없다. 따라서 함수 매개변수의 스코프는 함수 몸체로 제한된 것이다.
변수 이름을 비롯한 모든 식별자는 선언된 위치에 따라서 식별자를 참조할 수 있는 유효 범위가 결정되는데 이를 스코프라고 한다.
2. 스코프의 종류
구분 | 설명 | 스코프 | 변수 |
전역 | 코드의 가장 바깥 영역 | 전역 스코프 | 전역 변수 |
지역 | 함수 몸체 내부 | 지역 스코프 | 지역 변수 |
- 전역 변수는 어디서든지 참조할 수 있다.
- 지역 변수는 자신의 지역 스코프와 하위 지역 스코프에서 유효하다.
3. 스코프 체인
함수는 중첩될 수 있으므로, 지역 스코프 또한 중첩될 수 있다. 따라서 스코프는 함수의 중첩에 의해 '계층적 구조'를 갖는다. 그리고 이러한 계층적 구조를 가진 스코프를 스코프 체인이라고 한다.
변수를 참조할 때 이를 해석하는 엔진은 스코프 체인을 통해서 변수를 참조하는 코드에서 시작해서 바깥쪽으로 나가면서 선언된 변수를 찾는다.
4. 함수 레벨 스코프 vs 블록 레벨 스코프
- 함수 레벨 스코프 : 함수에 의해서'만' 지역 스코프가 생성됨
- 블록 레벨 스코프 : 함수 몸체뿐만 아니라 모든 코드 블록(if, for, while, ...)이 지역 스코프를 만듦
*자바스크립트 var 키워드로 선언된 변수는 only 함수 레벨 스코프만 지원한다. *
*반면에 let, const 키워드는 블록 레벨 스코프를 지원한다.*
5. 동적 스코프 vs 렉시컬 스코프
아래 코드에서 과연 어떤 결과가 나올지 조금만 생각해보자.
var x = 1;
function foo() {
var x = 10;
bar();
}
function bar() {
console.log(x);
}
foo(); // ?
bar(); // ?
이 결과는 bar 함수의 상위 스코프가 뭔지에 따라 결정된다. 2가지 방법으로 결정된다고 한다.
- 함수를 어디서 '호출'했는지에 따라 상위 스코프 결정 -> 동적 스코프
- 함수를 어디서 '정의'했는지에 따라 상위 스코프 결정 -> 렉시컬 스코프
자바스크립트를 비롯한 대부분의 프로그래밍 언어는 렉시컬 스코프를 채택했다.
여기까지 입니다 - 틀린 점이 있다면 꼭 지적해주세요!