ホームページ  >  記事  >  ウェブフロントエンド  >  条件を評価する前に JavaScript の実行を 5 秒間一時停止するにはどうすればよいですか?

条件を評価する前に JavaScript の実行を 5 秒間一時停止するにはどうすればよいですか?

DDD
DDDオリジナル
2024-11-02 00:16:31127ブラウズ

How to Pause JavaScript Execution for 5 Seconds Before Evaluating a Condition?

実行の一時停止: 5 秒待機の実装

JavaScript コードで、次のタイミングで問題が発生しています。ある機能。条件を評価する前に、コード ブロックの実行を 5 秒間遅延させることを目的としています。

指定したコード:

<code class="js">function stateChange(newState) {
  setTimeout('', 5000);

  if(newState == -1) {
    alert('VIDEO HAS STOPPED');
  }
}</code>

は、setTimeout が原因で目的の動作を実現しません。この関数は実際には if ステートメントの実行を遅らせません。代わりに、コールバック関数が 5000 ミリ秒後に実行されるようにスケジュールされますが、if ステートメントはすぐに実行されます。

これを解決するには、JavaScript の非同期プログラミング手法を利用できます。これにより、実行フローを一時停止し、後で再開してください。要件に対処できる 2 つのアプローチを次に示します。

ブラウザベースのソリューション

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

async function stateChange(newState) {
  await delay(5000);
  console.log("Waited 5s before checking condition");

  if (newState == -1) {
    alert('VIDEO HAS STOPPED');
  }
}</code>

このソリューションでは、Promise を作成する遅延と呼ばれるユーティリティ関数を定義します。指定されたミリ秒数後に解決されます。 async キーワードは、stateChange 関数を非同期にするために使用され、Promise が解決されるまで実行を一時停止できるようにします。

Node.js ソリューション

<code class="js">const { setTimeout } = require("timers/promises");

async function stateChange(newState) {
  await setTimeout(5000);
  console.log("Waited 5s before checking condition");

  if (newState == -1) {
    alert('VIDEO HAS STOPPED');
  }
}</code>

このソリューションは、 Promise を返す Node.js の組み込み setTimeout 関数。これにより、Promise が解決されるまで実行を一時停止できます。 async キーワードは前の例と同様に使用されます。

以上が条件を評価する前に JavaScript の実行を 5 秒間一時停止するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。