var a = 'global varible'; // 전역 스코프에 있는 변수는 코드 어디서나 참조할 수 있다!
function print() {
// 함수 블록 내에 있는 변수는, 함수 자신과 함수 몸체 내의 하위 함수에서만 참조할 수 있다!
var b = 'local varible';
console.log(a); // global varible
console.log(b); // local varible
}
print();
자바스크립트에서는 두 가지 레벨의 스코프를 사용할 수 있습니다
// 함수 레벨 스코프
var a = 1;
{
var a = 10; // var 키워드로 선언된 식별자가 재선언됨 (함수 레벨 스코프)
console.log(a); // 10 : 가장 가까운 이름 a의 식별자 참조
}
// 함수 레벨 스코프를 따르므로, 블록에는 구애받지 않음
// 즉, console에 출력되는 a는 var a = 1인 변수를 재활용한 것임
console.log(a); // 10
// 함수 레벨 스코프
var a = 1;
function print(){
var a = 10; // 독립적인 식별자 생성 (재선언이 아님)
console.log(a); // 10 : 가장 가까운 이름 a의 식별자 참조
}
print(a);
// 함수 레벨 스코프를 따르므로, 함수 코드 블록에 영향을 받음
// print() 내의 식별자 a는, print() 바깥의 식별자 a와 독립적임
console.log(a); // 1
// 블록레벨 스코프
let a = 1;
{
let a = 10; // 블록 레벨 스코프를 따르므로, 독립적인 식별자 선언
console.log(a); // 10 : 가장 가까운 이름 a의 식별자 참조
}
// 블록 레벨 스코프를 따르므로, 블록에 영향을 받음
// 블록 내의 식별자 a는, 블록 바깥의 식별자 a와 독립적임
console.log(a); // 1
스코프 체인
// 예시 : 함수 레벨 스코프 - var
var a = 10;
function print(){
// 함수 내에는 a라는 식별자가 없음
// 이 때, 값을 출력하기 위해 상위 스코프로 이동하여 식별자를 탐색함
console.log(a); // 10
}
print();
const number = 10;
{
const number2 = 30;
{
// 현재 스코프에는 number라는 식별자가 존재하지 않음
// 현재 스코프를 포함하는 상위 스코프로 이동해, 식별자를 찾아나감
console.log(number); // 10
}
}