2 つの一般的な JS 遅延メソッドの詳細な説明

JavaScript では、特定の機能を実現するために遅延操作を実行する必要があることがよくあります。たとえば、Web ページにアニメーションを表示したり、非同期リクエストを実行したりする場合、JS の実行時間を制御する必要があります。この記事では、setTimeout 関数と setInterval 関数を含む 2 つの一般的な JS 遅延メソッドを紹介します。

1. setTimeout 関数

setTimeout 関数を使用すると、一定時間後に関数またはコード フラグメントを実行できます。この関数は 2 つのパラメータを受け取ります。最初のパラメータは実行される関数またはコード フラグメント、2 番目のパラメータはミリ秒単位の遅延時間です。例:

setTimeout(function() {
    console.log('Hello World!');
}, 1000);

上記のコードは、1 秒後に「Hello World!」をコンソールに出力することを意味します。アロー関数の形式で記述することもできます:

setTimeout(() => console.log('Hello World!'), 1000);

遅延が終了する前に setTimeout 操作をキャンセルしたい場合は、clearTimeout 関数を使用できます。この関数は、setTimeout の一意の識別子をパラメータ。

let timeoutId = setTimeout(() => console.log('Hello World!'), 1000);
clearTimeout(timeoutId);

上記のコードでは、まず setTimeout 関数を使用して遅延操作を作成し、その識別子を timeoutId 変数に保存して、すぐに遅延操作をクリアします。

2. setInterval 関数

setInterval 関数は setTimeout 関数に似ており、操作の遅延を実装するためにも使用されます。違いは、setInterval 関数がループして、指定された関数またはコード フラグメントを停止するまで一定の間隔で実行することです。この関数は 2 つのパラメータを受け取ります。最初のパラメータは実行される関数またはコード フラグメント、2 番目のパラメータは 2 つの実行間の時間 (ミリ秒単位) です。例:

setInterval(function() {
    console.log('I am running!');
}, 1000);

上記のコードは、「I am running!」が 1 秒ごとに出力されることを意味します。

setInterval ループによる関数の実行を停止する必要がある場合は、setInterval の一意の識別子をパラメーターとして受け取る clearInterval 関数を使用できます。

let intervalId = setInterval(() => console.log('I am running!'), 1000);
clearInterval(intervalId);

上記のコードでは、まず setInterval 関数を使用してループ内で実行される操作を作成し、その識別子を intervalId 変数に格納してから、操作をすぐに停止します。

概要

setTimeout 関数と setInterval 関数はフロントエンド開発で非常に一般的で、これらを介して JS プログラムをより正確に制御し、スケジュールすることができます。特定の実装中は、予期しない結果を避けるために、パラメーターの設定と、clearTimeout 関数または clearInterval 関数を使用した操作のキャンセルに注意を払う必要があります。この記事が JS 初心者に役立つことを願っています。

以上が2 つの一般的な JS 遅延メソッドの詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。