포스트

자바스크립트에서 변수의 범위란 무엇인가

범위(scope)의 기초

자바스크립트에서 변수의 ‘범위’는 변수가 코드의 어느 부분에서 접근할 수 있는지를 결정합니다. 범위는 주로 두 가지 종류가 있습니다: 전역 범위(Global Scope)와 지역 범위(Local Scope).

전역 범위(Global Scope)

전역 범위에서 선언된 변수는 코드의 어느 곳에서든지 접근할 수 있습니다. 전역 변수는 보통 프로그램이 시작될 때 생성되고, 프로그램이 종료될 때까지 유지됩니다.

1
var globalVar = "I am global!";

지역 범위(Local Scope)

지역 범위에서 선언된 변수는 해당 범위 내에서만 접근이 가능합니다. 함수 내에서 선언된 변수는 그 함수의 지역 범위를 가집니다.

1
2
3
function myFunc() {
  var localVar = "I am local!";
}

렉시컬 범위(Lexical Scope) 이해하기

렉시컬이라는 단어는 ‘문법적’이라는 의미입니다. 렉시컬 범위는 변수가 코드 내에서 어떻게 구성되고 중첩되는지에 따라 결정됩니다.

1
2
3
4
5
6
function outerFunc() {
  var outerVar = "I am from outer!";
  function innerFunc() {
    var innerVar = "I am from inner!";
  }
}

여기서 innerFuncouterFunc 내부에 중첩되어 있으므로, innerFuncouterVar에 접근할 수 있습니다.

Hoisting(호이스팅)

호이스팅은 변수와 함수의 선언이 그 범위의 최상단으로 끌어올려진다는 자바스크립트의 특성입니다. 하지만 변수의 값은 호이스팅 되지 않습니다.

1
2
3
console.log(myVar); // undefined
var myVar = 5;
console.log(myVar); // 5

let과 const에 의한 블록 범위(Block Scope)

letconst 키워드를 사용하면, 블록 범위의 변수를 선언할 수 있습니다. 블록 범위는 중괄호 {}로 둘러싸인 코드 부분을 의미합니다.

1
2
3
if (true) {
  let blockVar = "I am block scoped!";
}

이 변수는 if문의 블록 내에서만 접근 가능합니다.

정리

자바스크립트에서 변수의 범위는 코드에서 변수가 어디까지 유효한지를 결정합니다. var, let, const 등 다양한 키워드와 문법을 이해하면 더 효율적인 코드를 작성할 수 있습니다. 이러한 지식은 변수 충돌을 피하고, 코드의 가독성을 높이는 데 큰 도움이 됩니다.

이 기사는 저작권자의 CC BY 4.0 라이센스를 따릅니다.