[내만족JS] 스코프에 대해서

김진영·2023년 4월 27일
0

내만족 JS

목록 보기
1/2
post-thumbnail

정의

💡 식별자가 유효한 범위

스코프는 모든 프로그래밍 언어의 기본적이면서도 가장 중요한 개념입니다.
이러한 스코프는 변수, 함수와 관련이 있습니다.
자바스크립트에서 변수는 선언된 위치에 의해 유효 범위가 결정됩니다.
눈치 채셨겠지만, 스코프는 식별자(변수 혹은 함수)가 유효한 범위를 의미합니다.
자바스크립트 엔진은 식별자를 검색할 때 스코프를 일종의 지도로써 참고합니다.

TMI

💡 자바스크립트 엔진

자바스크립트 엔진은 코드를 실행할 때 코드의 문맥을 고려합니다.
코드의 문맥은 렉시컬 환경으로 구성됩니다.
(렉시컬 환경은 코드가 어디서 실행되고 주변에 어떤 코드가 있는지를 의미합니다)
이러한 렉시컬 환경을 구현한 것이 실행 컨텍스트입니다.
다시 말해서 모든 코드는 실행 컨텍스트에서 평가되고 실행되는 것입니다.
그리고 스코프는 실행 컨텍스트와 관련이 있습니다.

스코프 체인

💡 함수의 중첩 = 함수 지역 스코프의 중첩

함수 안에 또 다른 함수가 존재 가능합니다.
이를 함수의 중첩이라 하는데, 함수가 중첩 가능하다는 것은 함수의 지역 스코프도 중첩 가능하다는 것을 의미합니다.
지역 스코프가 중첩되면 각 지역 스코프들은 계층적 구조를 형성합니다.
바로 이 스코프 간 계층적인 구조가 스코프 체인입니다.
모든 스코프는 함수의 중첩에 의해 하나의 계층적 구조로 연결 가능합니다.

🍀 자바스크립트 엔진과 스코프 체인

자바스크립트 엔진은 스코프 체인을 통해 변수를 검색합니다.
이때 검색 방향은 변수를 참조하는 스코프에서 시작해 상위 스코프로 확장합니다.
이러한 특징 때문에 하위 스코프에서 상위 스코프의 변수를 참조할 수 있습니다.
반대로 상위 스코프에서는 하위 스코프의 변수를 참조할 수 없습니다.

조금 전문적인 용어를 섞어 설명해보겠습니다.
자바스크립트 엔진은 코드를 실행하기에 앞서 렉시컬 환경을 생성합니다.
스코프 체인은 실행 컨텍스트의 렉시컬 환경을 단방향으로 연결한 것입니다.

렉시컬 스코프

정적 스코프라고도 부릅니다.
자바스크립트는 렉시컬 스코프를 따릅니다.
앞서 살펴봤듯이 함수는 호출할 때 상위 스코프를 참조할 수 있습니다.
여기서 핵심은 함수를 어디서 정의했느냐에 따라 함수의 상위 스코프가 결정된다는 사실입니다.
함수가 호출된 위치는 상위 스코프 결정에 영향을 미치지 않습니다.

조금 전문적인 용어를 섞어 설명해보겠습니다.
함수의 상위 스코프는 함수 정의가 실행될 때 정적으로 결정됩니다.
'함수의 정의'는 함수 선언문 또는 함수 표현식을 사용해 이뤄집니다.
다시 말하면 함수를 정의한 위치에 의해서 상위 스코프가 결정되는 것입니다.
렉시컬 스코프는 클로저와 관련이 있습니다.
이에 대해서는 추후 살펴보도록 하겠습니다.

profile
기록해서 남길래요

0개의 댓글