javaScript-스코프

var var1 = 1; // 코드의 가장 바깥 영역에서 선언한 변수

if (true){
	var var2 = 2; // 코드 블록 내에서 선언한 변수
	if (true){
    	var var3 = 3; // 중첩된 코드 블록 내에서 선언한 변수
	}
}

funtion foo() {
	var var4 = 4; // 함수 내에서 선언한 변수
    
    function bar() {
    	var var5 = 5; // 중첩된 함수 내에서 선언한 변수
    }
}

console.log(var1); // 1
console.log(var2); // 2
console.log(var3); // 3
console.log(var4); // ReferenceError: var4 is not defined
console.log(var5); // ReferenceError: var5 is not defined

모든 식별자(변수 이름, 함수 이름, 클래스 이름 등)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정된다.

 

이를 스코프라고 한다. 즉, 스코프는 식별자가 유효한 범위를 말한다.

 

 

 

var x = 'global';

funtion foo(){
	var x = 'local';
	console.log(x); // A
}

foo();

console.log(x); // B

 

코드의 가장 바깥 영영과 foo함수 내부에 같은 이름을 갖는 x 변수를 선언했고 A와 B에서 x 변수를 참조한다.

이때 자바스크립트 엔진은 이름이 같은 두 개 의 변수 중에서 어떤 변수를 참조해야 할 것인지를 결정해야한다. 

이를 식별자 결정이라 한다.

 

자바스크립트 엔진은 스코프를 통해 어떤 변수를 참조해야 할 것인지 결정한다.

따라서 스코프란 자바스크립트 엔진이 식별자를 검색할 때 사용하는 규칙이라고도 할 수 있다.

 

 

A의 정답은 'local'

B의 정답은 'global' 이다.

 

식별자 이름이 동일하지만 스코프가 다르기 때문이다. 

A는 foo 함수 내부에서만 참조할 수 있고 foo 함수 외부에서는 참조할 수 없기 때문이다.

그 반면, B는 코드의 가장 바깥 영역에 선언된 x 변수는 어디서든 참조할 수 있다.

 

만약 스코프라는 개념이 없다면 같은 이름을 갖는 변수는 충돌을 일은키므로 프로그램 전체에서 하나밖에 사용할 수 없다.