[자바스크립트] 스코프

스코프

• 식별자의 유효범위
• 모든 식별자(변수 이름, 함수 이름, 클래스 이름 등)는 선언 위치에 따라 다른 코드가 본인을 참조할 수 있는 유효 범위가 결정된다.
• JS 엔진은 렉시컬 환경(코드가 실행되는 위치나 환경)을 고려해 코드를 실행한다. ⇒ 이를 구현한 것이 실행 컨텍스트!
• var 키워드로 선언된 변수는 같은 스코프 내 중복 선언이 허용된다 → 변수값이 재할당되어 변경되는 부작용이 생긴다.

스코프 종류

• 변수가 선언된 위치로 구분된다.

1. 전역 스코프
   • 코드 가장 바깥에 선언
   • 어디서든 참조 가능
2. 지역 스코프
   • 함수 내부에서 선언
   • 선언된 위치와 하위 지역 스코프에서 유효하다.

스코프 체인

• 함수가 중첩될 수 있기 때문에 지역 스코프 중첩도 가능하다. 즉, 함수 중첩에 의해 스코프 또한 계층적 구조를 가질 수 있다.
• 이렇듯 스코프가 계층적으로 연결된 것을 스코프 체인이라고 한다.
• 변수 참조 시 JS 엔진은 스코프 체인을 통해 참조하는 코드 스코프부터 상위 스코프 방향으로 선언된 변수를 검색한다.
• 렉시컬 환경에서 검색하고 없으면 outer 참조값을 타고 올라가서 검색

함수 레벨 스코프

• 함수에 의해서만 지역 스코프가 생성된다.
• C, 자바 같은 대부분의 프로그래밍 언어에서는 모든 코드 블록(if, while 등)에서 지역 스코프를 만드는데 이런 경우 블록 레벨 스코프라고 한다.
• var 변수는 오직 함수의 코드블록만 지역 스코프로 인정하는데, 이런 특성이 함수 레벨 스코프다.
• 반면 let, const는 블록 레벨 스코프를 지원한다.

스코프 종류

1. 동적 스코프

• 함수를 호출한 위치에 따라 상위 스코프 결정
• 함수 호출 시점에 동적으로 상위 스코프 결정

1. 렉시컬/정적 스코프

• 함수 정의한 위치에 따라 상위 스코프 결정
• 함수 정의가 평가되는 시점에 상위 스코프가 정적으로 결정
• JS는 렉시컬 스코프를 따른다!

⇒ 함수 정의 위치를 잘 따질 것!