>  기사  >  웹 프론트엔드  >  JavaScript Hoisting Demystified: 코딩 기술을 향상시키세요!

JavaScript Hoisting Demystified: 코딩 기술을 향상시키세요!

PHPz
PHPz원래의
2024-08-08 10:25:51740검색

안녕하세요? 여러분을 놀라게 할 JavaScript 개념인 호이스팅(Hoisting)에 대해 이야기해 봅시다! ?

호이스팅은 JavaScript가 컴파일 단계에서 변수와 함수 선언을 처리하는 방법에 관한 것입니다. 기본적으로 코드가 실행되기 전에도 이를 범위의 맨 위로 이동합니다. 잠깐, 뭐!
그렇다면 실제로는 무엇을 의미하나요?
음, 다음 코드가 있다고 가정해 보겠습니다.

   `console.log(myVar);
   var myVar = "Hello, world!";
   // It outputs: `undefined`

myVar이 선언되기 전에 로그를 시도하더라도 코드는 여전히 오류 없이 실행됩니다. 그 이유는 메모리 생성 단계에서 myVar에 기본값인 정의되지 않음이 할당되기 때문입니다. (JavaScript 작동 방식에 대해 제가 쓴 지난 게시물을 참조하세요.)

또 다른 예를 들어보겠습니다.
myFun();
function myFun() { console.log("나는 FuN입니다"); }

이 경우 전체 기능이 메모리에 저장됩니다. 콘솔( console.log(myFun) )을 실행하면 전체 함수가 인쇄되거나 실행되고 I am FuN이 출력되는 것을 볼 수 있습니다.

정말 멋지죠? 호이스팅은 코드에 몇 가지 흥미로운 영향을 미칠 수 있으므로 작동 방식을 이해하는 것이 중요합니다. ? 대화하고 싶은 다른 JavaScript 개념이 있으면 알려주세요!

마지막으로 화살표 기능은 어떻습니까? ???

또한 변수처럼 취급되며 전체 기능을 그 안에 저장합니다. 선언하기 전에 myFun()과 같이 호출하려고 하면 오류가 발생합니다.

예는 다음과 같습니다.

    `console.log("Before declaration myArrowFun: ", myArrowFun)
    var myArrowFun = () => { console.log("I am Arrow FuN"); }
    console.log("After declaration myArrowFun: ", myArrowFun)
    console.log("Call declaration myArrowFun: ", myArrowFun())`

JavaScript Hoisting Demystified: Elevate Your Coding Skills!

위 내용은 JavaScript Hoisting Demystified: 코딩 기술을 향상시키세요!의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.