JavaScript 범위 설명

어쨌든 범위 란 무엇입니까?

다행스럽게도 범위를 정의하는 것은 설명하기에 매우 복잡하지 않습니다. 범위는 코드/프로그램 내에서 변수를 보거나 액세스할 수 있는 방법을 나타냅니다.
JavaScript의 범위에는 세 가지 수준이 있습니다.

글로벌

로컬

블록

1. 글로벌 범위

함수 외부에서 선언된 모든 변수는 전역 범위를 갖는 것으로 간주됩니다. 즉, 프로그램 내의 모든 기능에서 어디에서나 액세스할 수 있습니다.

2. 지역 범위

변수가 함수 내에서 선언되면 해당 변수는 로컬 범위를 갖는 것으로 간주됩니다. 해당 변수는 해당 함수 내에만 존재하며 하위 함수만 액세스할 수 있습니다.

몇 가지 예를 살펴보겠습니다.

var myName = "Sheldon";

console.log(myName);

myName은 전역 변수이므로 잘 작동하고 콘솔에 "Sheldon"이 출력됩니다.

다른 것을 살펴보겠습니다.

function printMiddleName(){

    var middleName = "Lee";

}

console.log(middleName)

이제 이 코드를 실행하려고 하면 "Uncaught ReferenceError: middleName is not defined"오류가 발생합니다. middleName은 함수 내부에 정의되어 있기 때문에 다음과 같이 이름을 출력하거나 반환하도록 함수에 요청해야 합니다.

function printMiddleName(){

    var middleName = "Lee";

    return middleName;
}

console.log(printMiddleName());

그리고 이 코드는 잘 실행되어야 합니다.

중첩 함수(함수 내부의 함수)가 있고 하위 함수 내에서 변수에 액세스하려고 하면 이전과 동일한 오류가 발생한다는 점을 명심하십시오.

var myName = "Sheldon"

function printMiddleName(){

    var middleName = "Lee";

    function printLastName(){

        var lastName = "Cooper";

    }

    console.log(myName,middleName,lastName)
}

printMiddleName()

위의 코드는 존재하지 않는 지역 변수에 액세스하려고 하기 때문에 작동하지 않습니다.

var myName = "Sheldon"

function printMiddleName(){

    var middleName = "Lee";

    function printLastName(){

        var lastName = "Cooper";

        return lastName
    }

    console.log(myName,middleName,printLastName())
}

printMiddleName()

이것은 잘 작동하고 "Sheldon Lee Cooper"를 출력해야 합니다.

3. 블록 범위

이 블록은 꽤 새롭고 ES6(2015)까지는 실제로 존재하지 않았습니다. 중괄호 안에 선언된 변수는 블록 범위를 갖습니다. 블록 범위를 가질 수 있는 유일한 키워드는 let 및 const입니다.

{
  var name = "Sheldon";
  let middleName = "Lee";
  const lastName = "Cooper";
}

console.log(name); ✔ //this will print out "Sheldon"
console.log(middleName);❌  //will throw an error
console.log(lastName); ❌ //will also throw an error

블록 범위가 있는 변수는 해당 블록 외부에서 액세스할 수 없습니다.

결론

이 블로그가 도움이 되었기를 바랍니다. 누락되거나 부정확한 정보가 있는 경우 귀하의 피드백에 진심으로 감사드립니다. 끝까지 읽어주셔서 감사합니다.