스코프

🚩 스코프

• 식별자가 유효한 범위
• 자바스크립트 엔진이 식별자를 검색할 때 사용하는 규칙

🚩 스코프의 종류

• 전역 스코프
  • 코드의 가장 바깥 영역
  • 전역에 변수를 선언하면 전역 스코프를 갖는 전역 변수 → 어디서든지 참조할 수 있다.
• 지역 스코프
  • 함수 몸체 내부
  • 지역에 변수를 선언하면 지역 스코프를 갖는 지역 변수 → 자신의 지역 스코프와 하위 지역 스코프에서 유효하다.

🚩 함수 레벨 스코프

var 키워드로 선언된 변수는 오로지 함수의 코드 블록(함수 몸체)만을 지역 스코프로 인정합니다.

var i = 10;

for (var i = 0; i < 5; i++) {
  console.log(i); // 0 1 2 3 4
}

console.log(i) // 5

 

🚩 블록 레벨 스코프

let, const 키워드로 선언된 변수는 모든 코드 블록(함수, if 문, for 문, while 문, try/catch 문 등)을 지역스코프로 인정합니다.

let i = 10;

for (let i = 0; i<5; i++) {
  console.log(i); // 0 1 2 3 4
}

console.log(i); // 10

 

🚩 렉시컬 스코프

var x = 1;

function foo() {
  var x = 10;
  bar();
}

function bar() {
  console.log(x);
}

foo(); // 1
bar(); // 1

 

자바스크립트는 함수를 어디서 정의했는지에 따라 함수의 상위 스코프를 결정하는 렉시컬 스코프를 따릅니다.

함수가 호출된 위치는 상위 스코프 결정에 어떠한 영향도 주지 않습니다.

 

bar 함수는 전역에서 정의된 함수입니다. bar 함수는 전역 코드가 실행되기 전에 먼저 평가되어 함수 객체를 생성합니다.

이때 생성된 bar 함수 객체는 자신이 정의된 스코프, 즉 전역 스코프를 기억합니다.

그리고, bar 함수가 호출되면 호출된 곳이 어디인지 관계없이 언제나 자신이 기억하고 있는 전역 스코프를 상위 스코프로 사용합니다. 따라서 전역 변수 x의 값 1을 두 번 출력합니다.

 

🚩 참고

• 모던 자바스크립트 Deep Dive 13장