135

一度だけ実行できる関数を作成する必要があります。最初の関数以降は実行されません。私はC++とJavaから、作業を実行できる静的変数について知っていますが、これを実行するためのより洗練された方法があるかどうか知りたいですか?

4

25 に答える 25

269

「実行されない」とは、「複数回呼び出されても何もしない」という意味の場合、クロージャーを作成できます。

var something = (function() {
    var executed = false;
    return function() {
        if (!executed) {
            executed = true;
            // do something
        }
    };
})();

something(); // "do something" happens
something(); // nothing happens

@Vladloffe(現在は削除されています)によるコメントへの回答:グローバル変数を使用すると、他のコードが「実行済み」フラグの値(選択した名前)をリセットする可能性があります。クロージャがあると、他のコードは、偶然または故意にそれを行う方法がありません。

ここで他の回答が指摘しているように、いくつかのライブラリ(UnderscoreRamdaなど)には、関数を引数として受け取り、提供された関数を1回だけ呼び出す別の関数を返す小さなユーティリティ関数(通常はonce()[*]という名前)があります。返された関数が何度も呼び出されます。返された関数は、提供された関数によって最初に返された値もキャッシュし、後続の呼び出しでそれを返します。

ただし、そのようなサードパーティのライブラリを使用していないが、(上記で提供したナンスソリューションではなく)ユーティリティ関数が必要な場合は、実装が簡単です。私が見た中で最も素晴らしいバージョンは、David Walshによって投稿されたものです:

function once(fn, context) { 
    var result;
    return function() { 
        if (fn) {
            result = fn.apply(context || this, arguments);
            fn = null;
        }
        return result;
    };
}

fn = null;私はに変更する傾向がありますfn = context = null;context一度呼び出された後の参照を維持するためにクロージャが呼び出される理由はありませんfn

使用法:

function something() { /* do something */ }
var one_something = once(something);

one_something(); // "do something" happens
one_something(); // nothing happens

[*]ただし、 このjQueryのDrupal拡張機能など、他のライブラリには、まったく異なることを行うという名前の関数がある場合があることに注意してください。once()

于 2012-10-03T17:20:49.053 に答える
69

再利用可能なNOOP (操作なし)機能に置き換えてください。

// this function does nothing
function noop() {};

function foo() {
    foo = noop; // swap the functions

    // do your thing
}

function bar() {
    bar = noop; // swap the functions

    // do your thing
}
于 2012-10-03T17:20:45.303 に答える
40

呼び出されたら、空の関数をポイントします。

function myFunc(){
     myFunc = function(){}; // kill it as soon as it was called
     console.log('call once and never again!'); // your stuff here
};
<button onClick=myFunc()>Call myFunc()</button>


または、そのように:

var myFunc = function func(){
     if( myFunc.fired ) return;
     myFunc.fired = true;
     console.log('called once and never again!'); // your stuff here
};

// even if referenced & "renamed"
((refToMyfunc)=>{
  setInterval(refToMyfunc, 1000);
})(myFunc)

于 2014-05-15T17:44:53.223 に答える
25

UnderscoreJsにはそれを行う関数underscorejs.org/#onceがあります

  // Returns a function that will be executed at most one time, no matter how
  // often you call it. Useful for lazy initialization.
  _.once = function(func) {
    var ran = false, memo;
    return function() {
      if (ran) return memo;
      ran = true;
      memo = func.apply(this, arguments);
      func = null;
      return memo;
    };
  };
于 2012-10-03T17:20:18.273 に答える
12

静的変数について言えば、これはクロージャーバリアントに少し似ています。

var once = function() {
    if(once.done) return;
    console.log('Doing this once!');
    once.done = true;
};

once(); once(); 

その後、必要に応じて関数をリセットできます。

once.done = false;
于 2016-03-14T10:12:06.200 に答える
5

あなたは単に「それ自体を取り除く」機能を持つことができます

​function Once(){
    console.log("run");

    Once = undefined;
}

Once();  // run
Once();  // Uncaught TypeError: undefined is not a function 

しかし、エラーを飲み込みたくない場合は、これが最善の答えではない可能性があります。

これを行うこともできます:

function Once(){
    console.log("run");

    Once = function(){};
}

Once(); // run
Once(); // nothing happens

スマートポインタのように機能する必要があります。タイプAの要素がない場合は実行でき、A要素が1つ以上ある場合は、関数を実行できません。

function Conditional(){
    if (!<no elements from type A>) return;

    // do stuff
}
于 2012-10-03T17:26:38.750 に答える
4
var quit = false;

function something() {
    if(quit) {
       return;
    } 
    quit = true;
    ... other code....
}
于 2012-10-03T17:19:27.943 に答える
2

これを試して

var fun = (function() {
  var called = false;
  return function() {
    if (!called) {
      console.log("I  called");
      called = true;
    }
  }
})()
于 2012-10-03T17:22:58.550 に答える
2

Crockfordという名前の男から...:)

function once(func) {
    return function () {
        var f = func;
        func = null;
        return f.apply(
            this,
            arguments
        );
    };
}
于 2014-04-16T10:26:48.950 に答える
2

で動作する再利用可能なinvalidate関数setInterval

var myFunc = function (){
  if (invalidate(arguments)) return;
  console.log('called once and never again!'); // your stuff here
};

const invalidate = function(a) {
  var fired = a.callee.fired;
  a.callee.fired = true;
  return fired;
}

setInterval(myFunc, 1000);

JSBinで試してみてください:https ://jsbin.com/vicipar/edit?js、console

Bunykからの回答のバリエーション

于 2017-04-27T23:50:45.253 に答える
2

必要なときに簡単に作成できるシンプルなデコレータ

function one(func) {
  return function () {
     func && func.apply(this, arguments);
     func = null;
  }
}

使用:

var initializer= one( _ =>{
      console.log('initializing')
  })

initializer() // 'initializing'
initializer() // nop
initializer() // nop
于 2018-07-14T08:12:49.857 に答える
1

これがJSFiddleの例です-http ://jsfiddle.net/6yL6t/

そしてコード:

function hashCode(str) {
    var hash = 0, i, chr, len;
    if (str.length == 0) return hash;
    for (i = 0, len = str.length; i < len; i++) {
        chr   = str.charCodeAt(i);
        hash  = ((hash << 5) - hash) + chr;
        hash |= 0; // Convert to 32bit integer
    }
    return hash;
}

var onceHashes = {};

function once(func) {
    var unique = hashCode(func.toString().match(/function[^{]+\{([\s\S]*)\}$/)[1]);

    if (!onceHashes[unique]) {
        onceHashes[unique] = true;
        func();
    }
}

あなたができること:

for (var i=0; i<10; i++) {
    once(function() {
        alert(i);
    });
}

そしてそれは一度だけ実行されます:)

于 2014-07-02T14:54:47.017 に答える
1

初期設定:

var once = function( once_fn ) {
    var ret, is_called;
    // return new function which is our control function 
    // to make sure once_fn is only called once:
    return function(arg1, arg2, arg3) {
        if ( is_called ) return ret;
        is_called = true;
        // return the result from once_fn and store to so we can return it multiply times:
        // you might wanna look at Function.prototype.apply:
        ret = once_fn(arg1, arg2, arg3);
        return ret;
    };
}
于 2014-10-28T08:55:47.597 に答える
1

Node.jsを使用している場合、またはbrowserifyでJavaScriptを記述している場合は、「1回」のnpmモジュールを検討してください。

var once = require('once')

function load (file, cb) {
  cb = once(cb)
  loader.load('file')
  loader.once('load', cb)
  loader.once('error', cb)
}
于 2014-12-09T12:02:17.703 に答える
1

将来的に関数を再利用できるようにしたい場合は、上記のed Hoppのコードに基づいてうまく機能します(元の質問ではこの追加機能が必要ではなかったことに気づきました!):

   var something = (function() {
   var executed = false;              
    return function(value) {
        // if an argument is not present then
        if(arguments.length == 0) {               
            if (!executed) {
            executed = true;
            //Do stuff here only once unless reset
            console.log("Hello World!");
            }
            else return;

        } else {
            // otherwise allow the function to fire again
            executed = value;
            return;
        }       
    }
})();

something();//Hello World!
something();
something();
console.log("Reset"); //Reset
something(false);
something();//Hello World!
something();
something();

出力は次のようになります。

Hello World!
Reset
Hello World!
于 2018-03-21T01:31:10.637 に答える
1

ライトを1回だけオンにする簡単な例。

function turnOnLightOnce() {
  let lightOn = false;

  return function () {
    if (!lightOn) {
      console.log("Light is not on...Turning it on for first and last time");
      lightOn = true;
    }

  };
}

const lightOn = turnOnLightOnce();
lightOn()  // Light is not on...Turning it on for first and last time
lightOn()
lightOn()
lightOn()
lightOn()

https://codesandbox.io/s/javascript-forked-ojo0i?file=/index.js

これは、JavaScriptのクロージャが原因で発生します。

于 2021-03-04T04:53:31.500 に答える
0

アンダースコア「once」関数を使用しようとしています:

var initialize = _.once(createApplication);
initialize();
initialize();
// Application is only created once.

http://underscorejs.org/#once

于 2014-04-17T11:15:34.107 に答える
0
var init = function() {
    console.log("logges only once");
    init = false;
}; 

if(init) { init(); }

/* next time executing init() will cause error because now init is 
   -equal to false, thus typing init will return false; */
于 2016-01-13T17:58:03.980 に答える
0
if (!window.doesThisOnce){
  function myFunction() {
    // do something
    window.doesThisOnce = true;
  };
};
于 2016-02-12T14:32:57.077 に答える
0

Ramdaを使用している場合は、関数「once」を使用できます。

ドキュメントからの引用:

once関数(a…→b)→(a…→b)パラメータv0.1.0で追加

関数fnを受け入れ、fnの呼び出しを保護する関数を返します。これにより、返された関数が何度呼び出されても、fnは一度だけ呼び出すことができます。計算された最初の値は、後続の呼び出しで返されます。

var addOneOnce = R.once(x => x + 1);
addOneOnce(10); //=> 11
addOneOnce(addOneOnce(50)); //=> 11
于 2017-05-25T16:01:32.510 に答える
0

できるだけシンプルにしてください

function sree(){
  console.log('hey');
  window.sree = _=>{};
}

あなたは結果を見ることができます

スクリプト結果

于 2019-08-20T09:52:53.613 に答える
0

JQueryでは、メソッドone()を使用して関数を1回だけ呼び出すことができます。

let func = function() {
  console.log('Calling just once!');
}
  
let elem = $('#example');
  
elem.one('click', func);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <p>Function that can be called only once</p>
  <button id="example" >JQuery one()</button>
</div>

JQueryメソッドon()を使用した実装:

let func = function(e) {
  console.log('Calling just once!');
  $(e.target).off(e.type, func)
}
  
let elem = $('#example');
  
elem.on('click', func);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <p>Function that can be called only once</p>
  <button id="example" >JQuery on()</button>
</div>

ネイティブJSを使用した実装:

let func = function(e) {
  console.log('Calling just once!');
  e.target.removeEventListener(e.type, func);
}
  
let elem = document.getElementById('example');
  
elem.addEventListener('click', func);
<div>
  <p>Functions that can be called only once</p>
  <button id="example" >ECMAScript addEventListener</button>
</div>

于 2020-04-07T19:47:25.537 に答える
0

楽しみのために私の帽子をリングに投げて、メモ化の利点を追加しました

const callOnce = (fn, i=0, memo) => () => i++ ? memo : (memo = fn());
// usage
const myExpensiveFunction = () => { return console.log('joe'),5; }
const memoed = callOnce(myExpensiveFunction);
memoed(); //logs "joe", returns 5
memoed(); // returns 5
memoed(); // returns 5
...
于 2020-08-23T00:42:07.333 に答える
-2

これは、(jQueryを使用して)無限ループを防ぐのに役立ちます。

<script>
var doIt = true;
if(doIt){
  // do stuff
  $('body').html(String($('body').html()).replace("var doIt = true;", 
                                                  "var doIt = false;"));
} 
</script>

名前空間の汚染が心配な場合は、「doIt」を長いランダムな文字列に置き換えてください。

于 2016-04-01T23:51:56.620 に答える
-2

スティッキーな実行を防ぐのに役立ちます

var done = false;

function doItOnce(func){
  if(!done){
    done = true;
    func()
  }
  setTimeout(function(){
    done = false;
  },1000)
}
于 2016-05-11T08:45:37.697 に答える