스코프(scope)

1. 스코프의 정의

: 스코프를 한 문장으로 표현하면 "식별자(변수, 함수, 클래스 이름)의 유효범위"이다. 즉 식별자를 어느 범위까지 사용할 수 있는 지를 나타내는 개념이다. 그렇다면 실제로 식별자의 유효범위는 어떻게 될까? 쳅터 2에서는 스코프 실습을 통해 알아보도록 하겠다.

 

2. 스코프 실습

예를 들어 다음과 같은 코드가 있다고 하자

function a() {
	var text = "b";
    
    console.log(text) // 1.
}

a()

console.log(text) // 2.

 먼저 1.에 찍히는 값은 무엇일까? 이 값에 대해서는 큰 고민 없이 b라고 대답할 수 있다. 하지만 2. 에 찍히는 값에 대해서 묻는 다면 대답하기 힘들 것이다. 그 이유는 2. 과정을 설명하기 위해 스코프라는 개념이 들어가기 때문이다. 스코프를 이 사례에서 설명하기 전에 실행 컨텍스트에 대해서 간단하게 집고 넘어가자.

 앞서 작성한 코드는 런타임 이전에 전역 컨텍스트와 a 함수와 관련된 컨텍스트를 콜스택에 저장할것이다. 그리고 이때 저장한 a 함수 컨텍스트 > 레코드에 text 식별자에 대한 정보가 담길 것이다. 즉 text라고 하는 식별자는 a 컨텍스트 내에서만 유효한 범위를 가지는 것이다. 이를 달리 표현하면 text 식별자는 함수 a에 한해서 스코프를 가진다고 볼 수 있다. 그래서 2.에 찍히는 값은 참조 에러가 뜰 것이다. 이렇게 우린 실습을 통해서 스코프라고 하는 개념을 실행 컨텍스트와 함께 설명할 수 있게 되었다. 이제 이 개념이 정말로 자신의 것이 되었는지를 확인하기 위해서 작은 퀴즈를 준비했다. 

 

3. 스코프 퀴즈

var text1 = "a";

function a() {
	var text1 = "hello";
    
    console.log(text1) // ??
}

function b() {
	var text2 = "world";
    
    console.log(text2) // ??
	
}

a()
b()

console.log(text1) // ??
console.log(text2) // ??

 

참고자료

https://minprogramming.tistory.com/entry/Execution-Context-hoisting-scope

Execution Context (+ hoisting , scope)