[TIL/모던 자바스크립트 Deep Dive] 2023/06/05

13장. 스코프 🟢

코드는 ``전역(global)`과 `지역(local)``으로 구분할 수 있다.

전역에서 선언된 변수는 전역 스코프를 갖는 ``전역 변수`이고, 지역에서 선언된 변수는 지역 스코프를 갖는 `지역 변수``라고 할 수 있다.

13-2. 스코프의 종류 🟡

전역과 전역 스코프 🟣

코드의 가장 바깥에서 선언된, 각각 'global x'와 'global y'라는 문자열이 할당된 'x와 y 변수'는 전역 변수이므로, 어디서든 참조가 가능하다. '어디서든'은 문자 그대로, 함수 내부에서도 참조할 수 있다는 것을 뜻한다.

> **지역과 지역 스코프 🟣**

우선 outer 함수 내부에 선언한 '변수 z'는 지역 변수다. 자신의 지역 스코프인 outer 함수 내부와 하위 지역 스코프인 inner 함수 내부에서 해당 변수를 참조할 수 있다. 8번을 보면, 지역 변수를 전역에서 참조하려고 해서 reference Error가 발생했다.

한편 inner 함수 내부에는, 전역 변수와 이름이 동일한 '변수 x'가 존재한다. 4번에서 확인할 수 있듯, inner 함수에서 x 변수를 참조하면 전역 변수를 참조하는 것이 아니라, inner 함수 '내부에서 선언된 x 변수'를 참조한다. 자바스크립트 엔진이 ``스코프 체인``을 통해 참조할 변수를 검색했기 때문이다.

13-3. 스코프 체인 🟡

전역에서 정의된 함수는 '전역 함수'다. 함수 몸체 내부에서 정의된 함수를 '중첩 함수'라고 하고, '중첩 함수'를 포함하는 함수를 '외부 함수'라고 한다.

함수의 중첩은, 함수 지역 스코프의 중첩을 의미한다. 중첩 함수의 지역 스코프가, 중첩 함수를 포함하는 외부 함수의 지역 스코프와 계층적 구조를 갖는다는 뜻이다. 이때 외부 함수의 지역 스코프를 중첩 함수의 상위 스코프라고 한다. 위 코드 예제로 설명하면, inner 함수는 outer 함수의 중첩 함수이고, outer 함수의 지역 스코프는 inner 함수의 상위 스코프라고 할 수 있다. 더 나아가서 outer 스코프의 상위 스코프는 전역 스코프이다.

따라서 ``스코프 체인`은 `스코프의 계층적 연결``이다. 변수를 참조할 때 자바스크립트 엔진은 스코프 체인을 통해, 변수를 참조하는 코드의 스코프에서 시작하여 상위 스코프 방향으로 이동하며 선언된 변수를 '검색'한다.

스코프 체인에 의한 변수 검색 🟣

예제 코드를 다시 보자.

4번에서, x 변수를 참조하는 코드를 작성하면 가장 먼저 inner 함수의 지역 스코프에서 x 변수가 선언되었는지 확인한다. 'inner's local x'라는 문자열이 할당된 x 변수가 존재하기에, 검색된 변수를 참조하고 검색을 종료한다.

5번에서는, y 변수를 참조하는 코드를 작성하면 inner 함수에서 y 변수가 선언되었는지 검색한다. y 변수의 선언을 확인할 수 없기에 상위 스코프인 outer 함수의 지역 스코프에서 검색을 시작한다. outer 함수에서도 y 변수의 선언은 없었기에 전역 스코프로 이동한다. 결과적으로 전역 스코프에서 검색된 y 변수를 참조하고 검색을 종료한다.

자바스크립트 엔진은 이처럼 스코프 체인을 따라 변수를 참조하는 코드의 스코프에서 시작해서 상위 스코프 방향으로 이동하며 선언된 변수를 검색한다. 달리 표현하면, ``상위 스코프에서 유효한 변수는 하위 스코프에서 자유롭게 참조할 수 있지만, 하위 스코프에서 유효한 변수를 상위 스코프에서 참조할 수는 없다.``

스코프 체인에 의한 함수 검색 🟣

함수 선언문으로 함수를 정의하면 런타임 이전에 함수 객체가 먼저 생성된다. 이후 자바스크립트 엔진은 함수 이름과 동일한 이름의 식별자를 암묵적으로 선언하고 생성된 함수 객체를 할당한다. 따라서 위 예제의 모든 함수는 함수 이름과 동일한 이름의 식별자에 할당된다.

1에서 foo 함수를 호출하면 자바스크립트 엔진은 함수를 호출하기 위해 먼저 함수를 가리키는 식별자 foo를 검색한다. 함수도 식별자에 할당되기에 스코프를 갖는다. 식별자에 함수 객체가 할당된 것 외에는 일반 변수와 다를 바 없다. 따라서 스코프는 ``식별자를 검색하는 규칙``이라고 표현하는 것이 적합하다.

13-4. 함수 레벨 스코프 🟡

지역(local)은 함수 몸체 내부를 말하고 지역은 지역 스코프를 만든다. 코드 블록이 아니라 함수에 의해서 지역 스코프가 생성된다는 뜻이다.

C나 JAVA 등을 포함한 대부분의 프로그래밍 언어는, 함수 몸체만이 아니라 모든 코드 블록이 지역 스코프를 만드는데 이러한 특성을 ``블록 레벨 스코프(block level scope)``라고 한다.