🐝 스코프(Scope)
스코프란 어떤 변수에 접근할 수 있는 범위를 의미합니다.
스코프의 종류는 아래와 같습니다.
- 전역(global) 스코프: 어디서나 해당 변수에 접근 가능
- 지역(local) 스코프: 한정적인 범위 내에서만 해당 변수에 접근 가능
- 블록 스코프
- 함수 스코프
🐝 블록 스코프
블록 스코프란 중괄호로 둘러싸인 { 블록 } 내부에서 선언된 변수는 해당 블록 안에서만 호출 가능한 것을 의미합니다.
ES6 이후에 등장한 let과 const를 이용하여 선언한 변수가 블록 스코프의 개념을 따릅니다.
예를 들어, 아래와 같은 코드가 있을 때
{
let test = 'block scope';
console.log(test); // 블록 내부에서 접근👍
}
console.log(test); // !블록 외부에서 접근👎블록 내부에서 변수에 접근한 첫 번째 console.log만 제대로 출력되고,
블록 외부에서 변수에 접근한 두 번째 console.log는 에러가 나며 메시지가 출력되지 않습니다.
중괄호 앞에 function과 같은 키워드가 없어도 중괄호로 둘러싸여 있다면 블록으로 취급됩니다.
예를 들어, 아래와 같은 코드가 있을 때
function printTest() {
let test = 'block scope';
console.log(test); // 블록 내부에서 접근👍
}
console.log(test); // !블록 외부에서 접근👎블록 안에 선언된 변수의 스코프는 해당 블록 안으로 제한됩니다.
🐝 함수 스코프
함수 스코프란 함수 내부에서 선언된 변수는 해당 함수 안에서만 호출 가능한 것을 의미합니다.
ES6 이전부터 존재했던 var을 이용하여 선언한 변수가 블록 스코프의 개념을 따릅니다.
예를 들어, 아래와 같은 코드가 있을 때
function printTest() {
var test = 'function scope';
console.log(test); // 함수 내부에서 접근👍
}
console.log(test); // 함수 외부에서 접근👎함수 내부에서 변수에 접근한 첫 번째 console.log만 제대로 출력되고,
함수 외부에서 변수에 접근한 두 번째 console.log는 에러가 나며 메시지가 출력되지 않습니다.
function이라는 키워드가 있어야 함수로 취급되기 때문에 키워드가 없는 블록 안에 위치한 변수는 스코프가 제한되지 않습니다.
예를 들어, 아래와 같은 코드가 있을 때
{
var test = 'function scope';
console.log(test); // 블록 내부에서 접근👍
}
console.log(test); // var 변수는 블록 외부에서 접근해도👍함수가 아닌 블록 밖에서 접근하는 것은 에러가 나지 않고 메시지가 잘 출력됩니다.
읽어주셔서 감사합니다:)
