스코프

함수 스코프는 지역 스코프의 가장 흔한 사례이다.

var a = 1; // 전역 스코프
function print() { // 지역(함수) 스코프
 var a = 111;
 console.log(a);
}
print(); // 콘솔에 111 출력
console.log(a); // 콘솔에 1 출력

var x = 'global';

function foo () {
  var x = 'function scope';
  console.log(x);
}

foo(); // 함수 스코프로부터 function scope 출력
console.log(x); // 전역 스코프로부터 global 출력

 

 

 

스코프 체인 : 자신의 스코프에 사용하고자 하는 변수가 없으면 스코프 체인을 통해 변수를 찾는다.

var a = 1; // 전역 스코프
function print() { // 함수 스코프
 console.log(a);
}
print(); // 1

 

---

블록레벨 스코프 : let, const

var x = 0;
{
  var x = 1;
  console.log(x); // 1
}
console.log(x);   // 1

let y = 0;
{
  let y = 1;
  console.log(y); // 1
}
console.log(y);   // 0

var로 선언된 x는 중괄호를 무시하고 가까운 변수가 적용되는 모습이다.

let으로 선언된 y는 블록 안에서 적용되는 모습이다. 

 

이는 TDZ와도 관련이 있다.

let 키워드로 선언된 변수는 스코프의 시작에서 변수의 선언까지 일시적 사각지대(Temporal Dead Zone; TDZ)에 빠지기 때문이다.

console.log(foo); // undefined
var foo;

console.log(bar); // Error: Uncaught ReferenceError: bar is not defined
let bar;

 

const 역시 블록레벨 스코프를 가지고 있는데, 특히 중괄호 안에서 선언한 x와 밖의 x 값이 달라도 된다는 점이 주목할 만 하다.

const x = 0;
{
  const x = 1;
  console.log(x); // 1
}
console.log(x);   // 0

let y = 0;
{
  let y = 1;
  console.log(y); // 1
}
console.log(y);   // 0

const도 마찬가지로