[JavaScript] 자바스크립트 블록레벨 스코프, 함수레벨 스코프

🎯 블록 레벨 스코프, 함수 레벨 스코프

📝 함수 레벨 스코프(Function-level scope)

• 함수 내에서 선언된 변수는 함수 내에서만 유효하며 함수 외부에서는 참조할 수 없다.
• 즉, 함수 내부에서 선언한 변수는 지역 변수이며 함수 외부에서 선언한 변수는 모두 전역 변수이다.

 

📝 블록 레벨 스코프(Block-level scope)

• 모든 코드 블록(함수, if 문, for 문, while 문, try/catch 문 등) 내에서 선언된 변수는 코드 블록 내에서만 유효하며 코드 블록 외부에서는 참조할 수 없다.
• 즉, 코드 블록 내부에서 선언한 변수는 지역 변수이다.

 

📝 예제

var foo = 123; // 전역 변수

console.log(foo); // 123

{
  var foo = 456; // 전역 변수
}

console.log(foo); // 456

• 블록 레벨 스코프를 따르지 않는 var 키워드의 특성상, 코드 블록 내의 변수 foo는 전역 변수이다.
• 그런데 이미 전역 변수 foo가 선언되어 있다. var 키워드를 사용하여 선언한 변수는 중복 선언이 허용되므로 위의 코드는 문법적으로 아무런 문제가 없다.
• 단, 코드 블록 내의 변수 foo는 전역 변수이기 때문에 전역에서 선언된 전역 변수 foo의 값 123을 새로운 값 456으로 재할당하여 덮어쓴다.
• ES6는 블록 레벨 스코프를 따르는 변수를 선언하기 위해 let 키워드를 제공한다.

let foo = 123; // 전역 변수

{
  let foo = 456; // 지역 변수
  let bar = 456; // 지역 변수
}

console.log(foo); // 123
console.log(bar); // ReferenceError: bar is not defined

 

📌 참고

• let, const | PoiemaWeb