Javascript 범위 및 범위 체인

범위는 Javascript에서 선언된 특정 변수에 액세스할 수 있는 장소와 같으며 특정 범위에서 변수를 사용할 수 없으면 사용할 수 없습니다.

범위 유형

Javascript에는 3가지 주요 범위 유형이 있습니다.

글로벌 범위

이것은 선언된 변수 또는 함수에 액세스할 수 있는 범위이며 최상위 수준에 있습니다.

const name = "John";
console.log(name); // John

변수 이름은 전역 범위에서 생성되므로 함수 범위 내에서도 어디에서나 액세스할 수 있습니다.

const name = "John";
function logName() {
    console.log(name); //John
}
logName();

기능 범위

이것은 함수와 메서드 내부의 범위이며 여기에서 선언된 모든 항목은 전역 범위에서 액세스할 수 없습니다.

function createName() {
    const name = "John";
    console.log(name); // John
}
createName();
console.log(name); // name is not defined

블록 범위(ES6만 해당)

이것은 if 문과 루프 내부의 범위이며 let 및 const로 선언된 모든 변수는 범위 외부에서 액세스할 수 없습니다.

if (true) {
    const name = "John";
}
console.log(name); // name is not defined

그러나 변수를 var로 선언하면 스코프 밖에서도 접근이 가능하다.

if (true) {
    var name = "John";
}
console.log(name); // John

스코프 체인

다른 범위 내부의 범위 안에 범위를 만들면 범위 체인을 만듭니다.

예시

function fnc1() {
  //scope 2
  return function () {
    //scope 3
    return function () {
      //scope 4
      return function () {
        //scope 5
      };
    };
  };
}

모든 범위는 상위 수준 범위 내에서 선언된 변수에만 액세스할 수 있습니다.
범위 5는 모든 범위 4, 3, 2 및 전역 범위 변수에 액세스할 수 있습니다.
범위 4는 모든 범위 3, 2 및 전역 범위 변수에 액세스할 수 있습니다.
등