스코프(scope)란? ✨
스코프란?
변수는 자신이 선언된 위치에 의해 자신이 유효한 범위, 즉 다른 코드가 변수 자신을 참조할 수 있는 범위가 결정된다.
변수 뿐 아니라 모든 식별자(변수 이름, 함수 이름, 클래스 이름 등)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정되며, 이를 스코프라 한다.
즉, 스코프는 식별자가 유효한 범위를 말한다.
우리는 스코프를 이미 경험했다. 함수의 매개변수는 함수 몸체 내부에서만 참조할 수 있고 함수 몸체 외부에서는 참조할 수 없다고 했다. 이것은 매개변수를 참조할 수 있는 유효범위, 즉 매개변수의 스코프가 함수 몸체 내부로 한정되기 때문이다.
예제
코드의 가장 바깥 영역과 foo 함수 내부에 같은 이름을 갖는 x 변수를 선언했고 (1)과 (2)에서 x 변수를 참조한다.
1
2
3
4
5
6
7
8
9
var x = "global";
function foo() {
var x = "local";
console.log(x); // (1) local
}
foo();
console.log(x); // (2) global
두 개의 x 변수는 이름이 동일한 식별자이지만 스코프가 다른 별개의 변수다.
자바스크립트 엔진은 스코프를 통해 어떤 변수를 참조해야 할 것인지 결정한다. (식별자 결정)
따라서 스코프란 자바스크립트 엔진이 식별자를 검색할 때 사용하는 규칙이라고도 할 수 있다.
자바스크립트 엔진은 코드를 실행할 때 코드의 문맥(context)을 고려한다.
코드가 어디서 실행되며 주변에 어떤 코드가 있는지에 따라 위 예제의 (1)과 (2)처럼 동일한 코드도 다른 결과를 만들어 낸다.
코드가 어디서 실행되며 주변에 어떤 코드가 있는지를 렉시컬 환경이라고 부른다. 즉 코드의 문맥(context)은 렉시컬 환경으로 이뤄진다. 이를 구현한 것이 실행 컨텍스트이며, 모든 코드는 실행 컨텍스트에서 평가되고 실행된다.
- 스코프 내에서 식별자는 유일해야 하지만 다른 스코프에는 같은 이름의 식별자를 사용할 수 있다. 즉, 스코프는 네임스페이스다.