스코프(Scope) - 전역변수와 지역변수
스코프(Scope) - 전역변수와 지역변수
자바스크립트에서 스코프(Scope)는 변수와 함수에 대한 접근 규칙을 정의하는 개념이다. 즉, 스코프는 변수와 함수가 어디서부터 접근 가능한지 결정하게 된다.
스코프는 전역과 지역으로 나뉜다.
- 전역 스코프(Global Scope) - 어떤 함수 안에서도 선언되지 않는 변수는 전역 스코프에서 선언되어 코드 전역에서 변수와 함수 어디서든지 접근이 가능하다.
- 지역 스코프(Local Scope) - 함수 내부에서 선언된 변수와 함수는 해당 지역에서만 사용 가능하며, 함수가 실행되면 지역 스코프가 생성되고 함수 종료와 함께 사라진다.
globalVar를 전역 변수로 선언 후, localScope안에서 localVar를 지역 변수로 선언한다. 함수를 호출하면 전역과 지역 모두에 접근이 가능하다. 하지만 함수가 실행을 마치게 되면 지역 변수인 localVar는 사라지게 되므로 Reference Error를 발생시킨다.
클로저(Closure)와 스코프 체인(Scope Chain)
스코프는 중첩될 수 있다. 만약 함수 내부에서 다른 함수를 선언할 경우, 내부 함수는 외부 함수의 스코프에 접근할 수 있다. 이를 클로저(Closure)라고 한다.
스코프 체인은 변수나 함수를 찾을 때, 현재 위치의 스코프부터 시작하여 상위 스코프로 이동하며, 해당 변수나 함수를 찾아가는 과정을 뜻한다. 스코프 체인을 이용해 함수 내부에서 선언된 변수를 외부에서 사용할 수 있는 클로저를 만들 수 있다.
outerFunction함수 내부에서 innerFunction 함수를 선언하고, innerFunction 함수를 반환한다.
outerFunction 함수가 호출되면, closure 변수에 innerFunction 함수가 저장된다. 이후 closure 변수를 호출하면 innerFunction 함수가 실행되고 outerFunction 함수의 스코프 체인을 따라서 outerVar 변수에 접근할 수 있다. 이러한 방식으로 innerFunction 함수는 클로저를 만들게 된다.
블록 스코프(Block Scope)
ES6부터는 let과 const를 사용하여 블록 스코프를 사용할 수 있다. 이전에는 var키워드로 변수를 선언할 때, 함수 스코프(Function Scope)만 지원했다. 블록 스코프는 중괄호로({})로 감싸인 코드 블록 내부에서 변수가 선언되면, 해당 변수는 해당 블록 내부에서만 유효하게 된다.
for 반복문의 블록 내부에서 let키워드를 사용하여 i 변수를 선언했을 때, i 변수는 for 문의 블록 내부에서만 유효하다. 하지만 let 대신 var를 사용하게 되면 함수 스코프가 적용되어 함수 외부에서 접근 가능하다.
블록 스코프는 변수의 유효 범위를 내부로 제한함으로써 변수의 충돌을 막고, 코드의 가독성과 유지 보수를 좋게 한다. 블록 스코프를 사용하면, 함수 내부에서 발생하는 변수 호이스팅(Hoisting)과 같은 생각치 못했던 동작을 줄일 수 있다.