Demystifying JavaScript 변수 범위 및 호이 스팅

JavaScript 변수 범위 및 호이 스팅 이해 : 포괄적 인 가이드

프로그래밍의 초석 인 변수 범위는 프로그램 내에서 변수의 접근성을 지시합니다. 이 안내서는 JavaScript의 범위 메커니즘, 변수 선언 방법, 글로벌 대 로컬 범위 및 종종 완성 된 개념을 다루고 있습니다. 이러한 개념을 마스터하는 것은 강력하고 오류가없는 JavaScript 응용 프로그램을 구축하는 데 중요합니다. 주요 개념 :

JavaScript는 글로벌과 로컬의 두 가지 기본 범위 유형을 사용합니다. 로컬 스코프는 기능 스코프 (

)과 블록 스코프 ( 및 )로 세분을 세분화합니다. 선언은 기능 상단에 들어오고 와

는 블록의 상단에 들어 올려 지지만 초기화되지 않은 상태로 유지되어 "시간적 죽은 영역"을 만듭니다. 프로그램 전반에 걸쳐 액세스 할 수있는 글로벌 변수는 일반적으로 잠재적 충돌과 우발적 인 덮어 쓰기로 인해 낙담합니다. 기능 선언은 완전히 들어 올려서 표준 호이 스팅 규칙을 준수하는 기능 표현과 달리 정의 전에 호출을 가능하게합니다. JavaScript의 범위 및 호이 스팅 규칙의 적절한 이해와 적용은 일반적인 가변 관련 버그를 방지하고 코드 신뢰성을 향상시킵니다.

변수 범위는 자세히 설명합니다 JavaScript의 변수 범위는 선언 위치에 따라 결정되며 프로그램 내 접근성을 정의합니다. 변수 선언에는 세 가지 방법이 존재합니다 : 레거시 키워드 및 Modern 및

키워드.

는 유일한 옵션이지만 ES6 Pre-ES6,
• 및 var는 더 엄격한 규칙을 제공하여 코드 신뢰성을 향상시킵니다. JavaScript는 글로벌과 로컬의 두 가지 주요 범위를 특징으로합니다. 로컬 스코프는 추가 기능 범위 () 및 블록 스코프 ( 및 )로 분기됩니다. 함수 스코프는 특수한 블록 스코프 형태입니다 글로벌 범위 : let 스크립트의 가장 바깥 범위는 글로벌 범위입니다. 여기에서 선언 된 변수는 프로그램의 어느 곳에서나 액세스 할 수있는 글로벌이 될 수 있습니다. const 편리하지만, 전 세계 변수는 일반적으로 잠재적 충돌과 덮어 쓰기로 인해 낙담합니다.
로컬 스코프 :
• 블록 내에서 선언 된 변수 (예를 들어, , var, 함수)는 해당 블록에 로컬입니다. 함수는 let, const 및 로 선언 된 변수의 범위를 정의합니다. 코드 블록은
및
• 에 대한 범위 만 정의합니다. 는 함수 범위로 제한됩니다

  및 let 블록 스코프를 소개하여 각 블록마다 새로운 로컬 범위를 만듭니다. 독립형 블록도 스코프를 정의합니다 const 중첩 스코프가 가능하며, 내부 스코프는 외부 스코프의 변수에 액세스하지만 그 반대는 아닙니다. 범위에 대한 시각적 은유 :

  <:> 세계를 상상해보십시오 : 국가에는 국경 (스코프)이 있고, 국가 내 도시에는 자체 범위가 있습니다. 글로벌 범위는 세계의 바다와 같습니다. 이 비유는 범위의 작동 방식을 보여줍니다. 변수 검색은 가장 안쪽 범위에서 시작하여 발견되거나 오류가 발생할 때까지 바깥쪽으로 진행됩니다. 이 조회는 어휘 (정적) 스코핑이라고합니다 hoisting :

  <code class="language-javascript">// Global Scope
  const name = "Monique";
  
  function sayHi() {
    console.log(`Hi ${name}`);
  }
  
  sayHi(); // Hi Monique</code>

  JavaScript의 "호이 스팅"메커니즘은 변수 및 컴파일 동안 범위의 최상위로 이동합니다. 그러나 선언 만 발표됩니다. 과제는 제자리에 남아 있습니다. 이것을 고려하십시오 :
  는

  가 선언되었지만 아직 값을 할당하지 않았기 때문에 출력은 입니다. 엔진은 다음과 같이 해석합니다 및

  변수는 또한 호이스트되지 않았지만 초기화되지 않아 선언 전에 "Temporal Dead Zone (TDZ)을 초래합니다. TDZ 내에서 액세스하면 a

  .

  가 발생합니다 기능과 호이 스팅 :

  기능 선언이 완전히 들어 올려있어 정의 전에 호출을 허용합니다. 그러나 기능 표현은 표준 호이 스팅 규칙을 따릅니다 (선언, 할당이 남아 있음). 클래스는 변수와 유사하게 동작합니다 주요 차이점과 모범 사례 :

  : 함수-스코프 및

  : 블록 스코프 모든 선언은 들어 섰다 기능은 변수 앞에 들어갑니다 기능 선언은 변수 선언보다 우선하지만 과제는 없습니다.

  <code class="language-javascript">{
    // standalone block scope
  }</code>

  자주 묻는 질문 :
  • 변수가 액세스 할 수있는 영역 글로벌 대 지역 범위?
  글로벌 : 모든 곳에 접근 할 수 있습니다. 로컬 : 블록 또는 기능으로 제한 블록 스코프?
  • 블록으로 정의 된 로컬 스코프 ( 및 ). 호이 스팅은 어떻게 작동합니까? 선언은 범위의 상단으로 이동합니다.
  선언 vs. 호이 스팅의 초기화?
  • 선언이 발전하고 초기화가 유지됩니다. 및 ? 로 들어오는 후에는 들어 서지 않았지만 초기화되지 않았다. TDZ가 적용됩니다 let JavaScript의 범위 및 호이 스팅을 이해함으로써 개발자는 클리너,보다 예측 가능하며 오류가 발생하기 쉬운 코드를 작성할 수 있습니다. 더 나은 코드 구성 및 유지 보수 가능성을 위해 블록 범위 (const 및 )를 활용하는 것을 잊지 마십시오.

위 내용은 Demystifying JavaScript 변수 범위 및 호이 스팅의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!