자바스크립트 9. Scope(범위)

 처음에 Scope에 대해서 배울 때 쉽지 않았다.... 그래도 최선을 다해서 기록을 남겨보자.

 

 먼저 코드를 통해서 살펴보도록 하자!

let greeting = 'Welcome'; // global scope
function greetUnknown() { // local scope
 let name = 'Unknown';
 return greeting + ' ' + name;
} // local scope

greetUnknown(); // 'Welcome Unknown'
name; // ReferenceError, global scope

 위의 코드를 살펴보고 함수를 실행하게 되면 아름답게 'Welcome Unknown'을 반환해준다. 하지만 name을 실행하게 되면 Error가 띄게 된다. <Uncaught ReferenceError: name is not defined at <anonymous>:1:1> 즉, name이라는 변수가 정의 된적이 없다고 말하고 있다. 하지만 분명 함수 내에 선언을 했지만, 안쪽으로 접근이 안된다는 뜻이다. (칫 결계인가....)

 

 안쪽으로는 결계가 있어서 접근을 못하지만 안에서는 밖에 있는 변수에 접근이 가능하다. 그렇기 때문에 greeting에 할당된, "Welcome"이 뙇하고 들어오게 되서 문자열을 반환하게 된다. 

 

 코드를 보면 함수를 만들고 { }로 블럭을 지정해 놓았다. 블럭 안쪽(local scope)에 선언한 변수는 블록 안에서만 사용을 할 수 있다. 그렇기 때문에 name에 할당되어 있는 값은 외부에서 접근을 할 수 없다. 

 

 Scope는 변수 접근 규칙에 따른 유효범위를 뜻한다. 변수는 어떤 환경 내에서만 사용이 가능하고, 프로그래밍 언어는 각각의 변수 접근 규칙을 가지고 있다. JavaScript는 기본적으로 함수가 선언되는 동시에 자신만의 scope를 가진다. 

 

 Scope는 중첩이 가능하다. 그렇기 때문에 함수안에 함수를 넣을 수 있다. Global Scope는 최상단의 Scope로, 전역변수 어디서든 접근이 가능하다. 지역변수는 함수 내에서 전역변수보다 더 높은 우선순위를 가진다.

let sneaker = 'Vans';
function showSneaker() {
 let sneaker = 'Converse'; // 지역변수, showSneaker 함수 안에서만 접근 가능
 console.log(sneaker); // Converse
}

console.log(sneaker); // Vans
showSneaker(); 
console.log(sneaker); // Vans

 함수 안의 콘솔로그를 찍게 되면 Converse가 찍히는 것을 볼 수가 있다. 그리유는 지역변수가 전역변수보다 더 높은 우선 순위를 가지기  때문에 그렇다. 다음 코드도 살펴보자.

let sneaker = 'Vans';
function showSneaker() {
 sneaker = 'Converse'; // 지역변수, showSneaker 함수 안에서만 접근 가능
 console.log(sneaker); // Converse
}

console.log(sneaker); // Vans
showSneaker(); 
console.log(sneaker); // Converse

 함수 내의 sneaker 변수는 선언이 없기 때문에(let이 없다.) 바깥 스코프의 sneaker 변수를 그대로 가져오게 되고, converse를 할당하게 된다. 그렇게 함수를 실행하게 되면 sneaker에 converse하는 값이 재 할당 되기 때문에 마지막의 콘솔로그는 converse가 찍히게 된다. 

 

 그리고 블럭(Block)의 개념도 기록해보자! 

 블럭(Block) : 중괄호로 시작하고, 끝나는 단위를 말한다. 

if (true) {
 console.log('Aqua Eructo');
} 

for (let i = 0; i < 5; i++) {
 console.log(i)
}

{
 console.log('Confringo');
}

 이렇게 중괄호로 감싸 져있으면 하나의 블럭이라고 한다. 

다시 한번 정리 하자면 블럭 안(local scope)에 선언된 변수는 밖에서는 접근이 불가능하다! 하지만 안에서는 밖에(global scope) 범위에 있는 변수에는 접근이 가능하다.!

 

다음은 무엇을 기록해 볼까!