ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript で 1 回だけ実行される関数を作成するにはどうすればよいですか?

JavaScript で 1 回だけ実行される関数を作成するにはどうすればよいですか?

Mary-Kate Olsen
リリース: 2024-10-22 22:55:02
オリジナル
631 人が閲覧しました

How Can I Create Functions That Execute Only Once in JavaScript?

JavaScript の単一実行関数の詳細

プログラミングにおける一般的な要件には、1 回のみ実行できる関数の作成が含まれます。 C や Java などの言語での静的変数の使用が思い浮かぶかもしれませんが、JavaScript では、クロージャというエレガントな代替手段が提供されています。

クロージャについて

JavaScript のクロージャは、次のような関数です。親関数が戻った後でも、親関数のスコープにアクセスできます。クロージャを利用することで、以前に実行されたかどうかを追跡する関数を作成できます。

次の例を考えてみましょう:

<code class="javascript">var something = (function() {
    var executed = false;
    return function() {
        if (!executed) {
            executed = true;
            // Do something
        }
    };
})();

something(); // "Do something" happens
something(); // Nothing happens</code>
ログイン後にコピー

この例では、外側の関数がクロージャを作成します。内部関数周り。内部関数は、実行済みフラグが false に設定されているかどうかを確認します。これは、以前に実行されていないことを示します。 false の場合、フラグは true に設定され、必要なアクションが実行されます。後続の呼び出しでは、実行フラグは true のままとなり、関数は何も実行しません。

サードパーティ ライブラリ関数

Underscore などのさまざまなサードパーティ JavaScript ライブラリRamda は、once() などのユーティリティ関数を提供します。これらの関数は、別の関数を引数として受け取り、指定された関数を 1 回だけ実行する関数を返します。返された関数は、最初の実行時の値もキャッシュし、その後の呼び出しでその値を返します。

注目すべき実装の 1 つが David Walsh によって提供されています。

<code class="javascript">function once(fn, context) {
    var result;
    return function() {
        if (fn) {
            result = fn.apply(context || this, arguments);
            fn = null;
        }
        return result;
    };
}</code>
ログイン後にコピー

この関数は、指定された関数の周囲にクロージャを作成します。関数 (fn) とコンテキスト (context)。最初の実行では、result を fn の戻り値に設定し、fn を null に設定して、それ以降の実行を効果的に防止します。後続の呼び出しでは、キャッシュされた結果が返されるだけです。

使用法

これらの 1 回実行関数の使用は簡単です。実行したい関数を一度ユーティリティ関数に渡すだけで、返された関数は再実行を気にせずに必要に応じて呼び出すことができます。

たとえば、David Walsh の実装では次のようになります。

<code class="javascript">function something() { /* Do something */ }
var one_something = once(something);

one_something(); // "Do something" happens
one_something(); // Nothing happens</code>
ログイン後にコピー

結論

クロージャーとユーティリティ関数は、JavaScript で単一実行関数を作成する洗練された方法を提供します。これらのテクニックを理解して活用することで、特定の機能を 1 回だけ実行する必要がある状況に効率的に対処できます。

以上がJavaScript で 1 回だけ実行される関数を作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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