[JavaScript 기본] 스코프

스코프(`scope`)는 "변수나 함수에 접근할 수 있는 범위"를 의미함

---

1. 스코프의 종류

구분	설명	예시
전역 스코프(`Global Scope`)	코드 전체에서 접근 가능	함수 밖에서 선언된 변수
지역 스코프(`Local Scope`)	특정 코드 블록 `{ }`안에서만 접근 가능	함수 내부, 블록 내부에서 선언된 변수

---

2. 전역 스코프 & 지역 스코프 예시

let a = 1; // 전역 스코프

function funcA() {
  let b = 2; // 지역 스코프 (funcA 내부에서만 접근 가능)
  console.log(a); // 가능 (전역 변수 접근)

  function funcB() {} // funcA 내부 지역 스코프 함수
}

funcA();

console.log(a);  // 가능 (전역)
console.log(b);  // ReferenceError: b is not defined
console.log(funcB); // ReferenceError (funcA 내부 전용)

요약 하자면

• `a`는 전역 -> 어디서든 접근 가능
• `b`, `funcB`는 `funcA` 내부에서만 접근 가능
• 함수 안에서 선언된 모든 변수/함수는 "지역 스코프"

---

3. 블록 스코프 (`if`, `for`, `while` 등)

• `let`, `const`는 블록 스코프를 가짐
• 즉, `{ }` 내부에서만 접근 가능함

if (true) {
  let c = 1; // 블록 스코프
  console.log(c); // 1
}
console.log(c); // ReferenceError

---

4. 함수 선언문의 블록 스코프 주의점

• `function` 선언문은 브라우저 환경에서 다르게 동작할 수 있음

if (true) {
  let c = 1;
  function funcC() {} // 일부 환경에서는 전역 스코프처럼 동작
}

console.log(funcC); // 브라우저에서는 접근 가능할 수도 있음

주의할 점

• ES6 표준에서는 `function` 선언도 블록 스코프 안에 포함돼야 하지만,
  브라우저(특히 비엄격 모드) 에서는 여전히 전역 함수로 인식될 수 있음.
• Node.js나 "use strict" 모드에서는 `funcC`가 블록 내부 전용으로 제한됨.
• 즉, "엄격 모드"("use strict")에서는 `if`, `for` 내부에서 선언한 함수는 외부에서 접근 불가.

"use strict";
if (true) {
  function test() {}
}
console.log(test); // ReferenceError

---

5. `for`문 블록 스코프

for (let i = 0; i < 3; i++) {
  let d = i * 2;
  function funcD() {} // 브라우저에서는 전역처럼 인식될 수도 있음
}

// console.log(d); ReferenceError
console.log(funcD); // 브라우저에서는 가능 (비엄격 모드)

정리하자면,

• `let` / `const`로 선언된 변수는 for문 내부에서만 유효
• 하지만 `function` 선언문은 환경마다 다르게 스코프 처리됨
  -> 표준상 블록 내부 전용이지만, 브라우저에선 전역 등록 가능
• 안전하게 쓰려면?
  • 함수는 항상 "함수 안에서 선언"
  • 블록(`if`, `for`) 안에서는 함수 표현식(`=const func = () => {}`) 사용하기!"

---

6. 스코프 체인

• 스코프는 계층 구조로 연결되어 있음

let x = 1;

function outer() {
  let y = 2;
  function inner() {
    let z = 3;
    console.log(x + y + z); // 1 + 2 + 3
  }
  inner();
}
outer();

• 스코프 체인
  • `inner` -> `outer` -> `global` 순서로 변수 탐색
  • 자바스크립트는 항상 가장 가까운 스코프부터 찾음

---

 

구분	접근 가능 범위	비고
전역 스코프	전체 코드	어디서든 접근 가능
함수 스코프	함수 내부	함수마다 독립 공간
블록 스코프	`{ }` 내부	`let`, `const` 전용
스코프 체인	내부 → 외부 순서로 탐색	가장 가까운 변수부터 참조