>  기사  >  웹 프론트엔드  >  비동기 작업을 위해 JavaScript에서 대기 기능을 구현하는 방법은 무엇입니까?

비동기 작업을 위해 JavaScript에서 대기 기능을 구현하는 방법은 무엇입니까?

Patricia Arquette
Patricia Arquette원래의
2024-10-26 03:02:27106검색

How to Implement a Wait Function in JavaScript for Asynchronous Tasks?

JavaScript의 타이밍 지연

응답성이 뛰어나고 효율적인 웹 애플리케이션을 구축하려면 JavaScript의 타이밍 지연을 이해하는 것이 중요합니다. 이 기사에서는 코드 줄을 실행하기 전에 특정 시간을 기다리는 문제를 다룰 것입니다.

문제:

초보 JavaScript 개발자가 직면한 문제 조건을 평가하기 전에 함수가 의도한 대로 기다리지 않는 문제입니다. 예상되는 동작은 특정 상태가 변경되었는지 확인하기 전에 5초 동안 기다리는 것입니다. 그러나 현재 함수는 기다리지 않고 즉시 확인합니다.

해결책:

이렇게 원하는 동작을 달성하려면 다음 접근 방식을 활용할 수 있습니다.

브라우저:

최신 async/await 구문(ECMAScript 6 이상을 지원하는 브라우저에서 사용 가능)을 사용하여 다음 솔루션을 사용할 수 있습니다.

<code class="javascript">const delay = ms => new Promise(res => setTimeout(res, ms));

async function yourFunction() {
  await delay(5000);
  console.log("Waited 5s");

  await delay(5000);
  console.log("Waited an additional 5s");
}</code>

이 접근 방식은 비동기식으로 실행됨에도 불구하고 코드가 동기식으로 나타나도록 하여 코드를 단순화합니다.

Node.js:

Node.js 버전 16 이상의 경우 다음을 활용할 수 있습니다. 내장된 약속 기반 setTimeout 함수:

<code class="javascript">import { setTimeout } from "timers/promises";

async function yourFunction() {
  await setTimeout(5000);
  console.log("Waited 5s");

  await setTimeout(5000);
  console.log("Waited an additional 5s");
}</code>

주의:

경합 조건을 피하기 위해 지연 함수를 사용하는 것이 중요합니다(특히 비동기 테스트 시). 코드)은 종종 차선책으로 이어질 수 있으므로 주의해서 수행해야 합니다.

위 내용은 비동기 작업을 위해 JavaScript에서 대기 기능을 구현하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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