JavaScriptのクローズタイマー

WBOY
リリース: 2023-05-17 17:13:10
オリジナル
1470 人が閲覧しました

JavaScript では、タイマーは、スケジュールされた時間に特定のコードを実行するために使用される一般的なテクノロジです。タイマーは、カルーセル チャート、定期的なデータ取得、動的ページ更新などの機能を実装するためによく使用されます。この記事では、JavaScript でタイマーをオフにするいくつかの方法を紹介します。

  1. clearTimeout()

clearTimeout() メソッドは、setTimeout() メソッドによって作成されたタイマーをクリアするために使用できます。 setTimeout() メソッドは、指定された時間間隔の後にコードを 1 回実行するために使用されます。タイマーが不要または不適切な場合は、clearTimeout() メソッドを通じてタイマーをオフにすることができます。

たとえば、次のコードはタイマーを作成し、「Hello World!」を出力します。

var timer = setTimeout(function() {
  console.log("Hello World!");
}, 2000);
ログイン後にコピー

タイマーをオフにするには、以下に示すように、clearTimeout() メソッドを使用します。

clearTimeout(timer);
ログイン後にコピー
  1. clearInterval()

setTimeout() と同様に、setInterval() メソッドもタイマーの作成に使用されますが、その機能は指定された間隔内で繰り返すことです。特定のコード部分。 setInterval() メソッドによって作成されたタイマーを閉じる必要がある場合は、clearInterval() メソッドを使用できます。

たとえば、次のコードは、現在時刻を 1 秒ごとに出力するタイマーを作成します。

var timer = setInterval(function() {
  console.log(new Date());
}, 1000);
ログイン後にコピー

タイマーをオフにするには、以下に示すように、clearInterval() メソッドを使用します。 ##

clearInterval(timer);
ログイン後にコピー

    変数の使用
  1. ##clearTimeout() メソッドと clearInterval() メソッドの使用に加えて、次の値を変更することで変数をタイマーの識別子として使用することもできます。タイマーをオフにします。

たとえば、次のコードはタイマーを作成し、変数 isRunning を使用してタイマーが実行中かどうかを識別します。

var isRunning = true;
var timer = setInterval(function() {
  if (isRunning) {
    console.log("Hello World!");
  }
}, 1000);
ログイン後にコピー

タイマーをオフにするには、isRunning 変数の値を false に変更するだけです。 , 以下に示すように:

isRunning = false;
ログイン後にコピー

この方法の利点は、タイマーの動作を動的に制御できることです。特定の条件下でタイマーをオフにする必要がある場合は、この方法を使用できます。

ES6 アロー関数の使用
  1. ES6 で導入されたアロー関数はコードを簡素化し、タイマーの作成にも使用できます。 setTimeout() メソッドや setInterval() メソッドを使用する場合とは異なり、アロー関数自体がタイマーであり、関数の受信パラメーターを変更することでタイマーの動作を制御できます。

たとえば、次のコードはアロー関数を使用してタイマーを作成し、現在時刻を 1 秒ごとに出力します。

var timer = (fn => setInterval(fn, 1000))(function() {
  console.log(new Date());
});
ログイン後にコピー

タイマーをオフにするには、パラメーター fn を変更するだけです。以下に示すように、アロー関数の は null です。

fn = null;
ログイン後にコピー

要約

タイマーは、さまざまな関数を実装するために使用される非常に一般的なテクノロジです。 JavaScript では、setTimeout()、clearTimeout()、setInterval() メソッドの clearInterval() メソッドの使用、変数の使用、ES6 アロー関数の使用など、タイマーをオフにするさまざまな方法があります。さまざまな方法でさまざまなニーズに柔軟に対応できます。開発者は、プログラムの安定性とスムーズさを確保するために、特定の状況に基づいてタイマーをオフにする適切な方法を選択する必要があります。

以上がJavaScriptのクローズタイマーの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート