> 웹 프론트엔드 > JS 튜토리얼 > 변수가 선언되기 전에 변수에 할당된 함수 표현식을 사용하면 `setTimeout`이 실행되지 않지만 함수 선언에서는 성공하는 이유는 무엇입니까?

변수가 선언되기 전에 변수에 할당된 함수 표현식을 사용하면 `setTimeout`이 실행되지 않지만 함수 선언에서는 성공하는 이유는 무엇입니까?

DDD
풀어 주다: 2024-10-25 01:56:02
원래의
605명이 탐색했습니다.

Why does `setTimeout` fail to execute with a function expression assigned to a variable before it's declared, but succeeds with function declarations?

JavaScript 함수 선언 및 평가 순서

문제:

다음 JavaScript 예제가 실행되지 않는 이유는 무엇입니까?

<code class="javascript">(function() {
  setTimeout(someFunction1, 10);
  var someFunction1 = function() { alert('here1'); };
})();</code>
로그인 후 복사

다른 유사한 예는 의도한 대로 작동하지만:

<code class="javascript">(function() {
  setTimeout(someFunction2, 10);
  function someFunction2() { alert('here2'); }
})();

(function() {
  setTimeout(function() { someFunction3(); }, 10);
  var someFunction3 = function() { alert('here3'); };
})();

(function() {
  setTimeout(function() { someFunction4(); }, 10);
  function someFunction4() { alert('here4'); }
})();</code>
로그인 후 복사

해결책:

문제는 함수 선언과 함수 선언 간의 평가 순서에 있습니다. 함수 표현식.

함수 선언과 표현식

  • 선언: 함수 키워드를 사용하여 함수를 선언합니다(예: function someFunction( ) {}). 함수 선언은 컴파일 단계에서 처리됩니다.
  • 표현식: 함수로 평가되는 표현식을 사용하여 함수를 생성합니다(예: () => {} ). 함수 표현식은 실행 단계에서 처리됩니다.

평가 순서

JavaScript 코드는 두 가지 처리 단계를 거칩니다.

  1. 컴파일: 변수가 생성되고 함수 선언이 처리됩니다.
  2. 실행: 함수 표현식 및 기타 코드가 실행됩니다.

예제 분석

  • 예제 1:

    • someFunction1 함수는 함수 표현식 실행 단계에서.
    • someFunction1이 완전히 평가되어 someFunction1 변수에 할당되기 전에 setTimeout 함수가 호출됩니다.
    • setTimeout 함수는 someFunction1에 대해 정의되지 않은 값을 수신하고 실행에 실패했습니다.
  • 예제 2, 3, 4:

    • 이러한 각 예에서 함수는 function 키워드를 사용하여 선언하여 함수 선언으로 만듭니다.
    • 함수 선언은 컴파일 단계에서 처리되므로 setTimeout 함수가 호출되기 전에 존재합니다.
    • setTimeout 함수는 유효한 함수 참조를 수신하고 성공적으로 실행됩니다.

추가 설명

  • JavaScript의 함수 인수는 항상 값으로 전달됩니다. 즉, setTimeout 함수는 someFunction1 변수를 직접 참조하지 않고 참조하는 함수의 복사본을 참조합니다.

위 내용은 변수가 선언되기 전에 변수에 할당된 함수 표현식을 사용하면 `setTimeout`이 실행되지 않지만 함수 선언에서는 성공하는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿