168

I need to create a function which can be executed only once, in each time after the first it won't be executed. I know from C++ and Java about static variables that can do the work but I would like to know if there is a more elegant way to do this?

Improve this question
1

34 Answers 34

Reset to default
1
2
325

If by "won't be executed" you mean "will do nothing when called more than once", you can create a closure:

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

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

In answer to a comment by @Vladloffe (now deleted): With a global variable, other code could reset the value of the "executed" flag (whatever name you pick for it). With a closure, other code has no way to do that, either accidentally or deliberately.

As other answers here point out, several libraries (such as Underscore and Ramda) have a little utility function (typically named once()[*]) that accepts a function as an argument and returns another function that calls the supplied function exactly once, regardless of how many times the returned function is called. The returned function also caches the value first returned by the supplied function and returns that on subsequent calls.

If, however, you aren't using such a third-party library but still want a utility function (rather than the nonce solution I offered above), it's easy enough to implement. The nicest version I've seen is this one posted by David Walsh:

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

I would be inclined to change fn = null; to fn = context = null;. There's no reason for the closure to maintain a reference to context once fn has been called.

Usage:

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

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

[*] Be aware, though, that other libraries, such as this Drupal extension to jQuery, may have a function named once() that does something quite different.

Improve this answer
Sign up to request clarification or add additional context in comments.

11 Comments

works very good , can you explain the login behind it , how does var executed = false; works
@EgyCode - This is explained nicely in the MDN documentation on closures.
sorry , I meant logic , I never understood boolean var and how it works in that case executed
@EgyCode - In certain contexts (like in an if statement test expression), JavaScript expects one of the values true or false and the program flow reacts according to the value found when the expression is evaluated. Conditional operators like == always evaluate to a boolean value. A variable can also hold either true or false. (For more info, see the documentation on boolean, truthy, and falsey.)
@Vaccano - Okay. Now I understand what you were asking, and I'm glad you found a solution. The local storage solution is a form of global variable (although at first glance it may not seem like it). Many other answers here use something like that. I see no reason to combine a global variable approach with a closure (as the answer to your question by Reflective suggests.)
|
73

Replace it with a reusable NOOP (no operation) function.

// 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
}
Improve this answer

15 Comments

@fableal: How is this inelegant? Again, it is very clean, requires less code, and doesn't require a new variable for every function that should be disabled. A "noop" is designed exactly for this sort of situation.
@fableal: I just looked at hakra's answer. So make a new closure and variable every time you need to do this to a new function? You have a very funny definition of "elegant".
Accordingly to asawyer's response, you only needed to do _.once(foo) or _.once(bar), and the functions themselves don't need to be aware of being ran only once (no need for the noop and no need for the * = noop).
Not really the best solution. If you're passing this function as a callback, it can still be called multiple times. For example: setInterval(foo, 1000) - and already this doesn't work anymore. You're just overwriting the reference in the current scope.
Reusable invalidate function which works with setInterval etc,.: jsbin.com/vicipar/1/edit?js,console
|
54

Point to an empty function once it has been called:

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

myFunc()
myFunc()

Or, like so:

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)

Improve this answer

5 Comments

This solution is much more in the spirit of a highly dynamic language like Javascript. Why set semaphores, when you can simply empty the function once it has been used?
Very nice solution! This solution is also performing better than the closure approach. The only minor "drawback" is that you need to keep the function name in sync if the name changes.
The problem with this is that if there's another reference to the function somewhere (e.g. it was passed as an argument and stashed in another variable somewhere -- as in a call to setInterval()) then the reference will repeat the original functionality when called.
@TedHopp - here's a special treatment for those cases
Yes, that's exactly like Bunyk's answer on this thread. It's also similar to a closure (as in my answer) but using a property instead of a closure variable. Both cases are quite different from your approach in this answer.
27

UnderscoreJs has a function that does that, 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;
    };
  };
Improve this answer

4 Comments

It seems funny to me to have once accept arguments. You could do squareo = _.once(square); console.log(squareo(1)); console.log(squareo(2)); and get 1 for both calls to squareo. Am I understanding this right?
@aschmied You are correct - the result of the first call's set of arguments will be memomized and returned for all other calls regardless of the parameter as the underlying function is never called again. In cases like that I do not suggest using the _.once method. See jsfiddle.net/631tgc5f/1
@aschmied Or I guess use a separate call to once per argument set. I don't think this is really intended for that sort of use.
Handy if you're already using _; I wouldn't recommended depending upon the entire library for such a small bit of code.
14

Talking about static variables, this is a little bit like closure variant:

var once = function() {
    if(once.done) return;

    console.log('Doing this once!');

    once.done = true;
};

once(); // Logs "Doing this once!"
once(); // Logs nothing

You could then reset a function if you wish:

once.done = false;
once(); // Logs "Doing this once!" again
Improve this answer

Comments

6

You could simply have the function "remove itself"

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

    Once = undefined;
}

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

But this may not be the best answer if you don't want to be swallowing errors.

You could also do this:

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

    Once = function(){};
}

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

I need it to work like smart pointer, if there no elements from type A it can be executed, if there is one or more A elements the function can't be executed.

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

    // do stuff
}
Improve this answer

3 Comments

I need it to work like smart pointer, if there no elements from type A it can be executed, if there is one or more A elements the function can't be executed.
@VladIoffe That's not what you asked.
This won't work if Once is passed as a call-back (e.g., setInterval(Once, 100)). The original function will continue to be called.
5 
var quit = false;

function something() {
    if(quit) {
       return;
    } 
    quit = true;
    ... other code....
}
Improve this answer

Comments

3

simple decorator that easy to write when you need 

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

using:

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

initializer() // 'initializing'
initializer() // nop
initializer() // nop
Improve this answer

Comments

3

I'm using typescript with node and it was @I Hate Lazy's answer that inspired me. I just assigned my function to a noop function.

let printName = (name: string) => {
    console.log(name)
    printName = () => {}
}

printName('Sophia') // Sophia
printName('Nico')   // Nothing Happens

https://jsbin.com/yuzicek/edit?js,console

Improve this answer

2 Comments

smart solution 🧠
very nice ... i love it
2

try this 

var fun = (function() {
  var called = false;
  return function() {
    if (!called) {
      console.log("I  called");
      called = true;
    }
  }
})()
Improve this answer

Comments

2

From some dude named Crockford... :)

function once(func) {
    return function () {
        var f = func;
        func = null;
        return f.apply(
            this,
            arguments
        );
    };
}
Improve this answer

1 Comment

This is great if you think that TypeError: Cannot read property 'apply' of null is great. That's what you get the second time you invoke the returned function.
2

Reusable invalidate function which works with 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);

Try it on JSBin: https://jsbin.com/vicipar/edit?js,console

Variation of answer from Bunyk

Improve this answer

Comments

1

Here is an example JSFiddle - http://jsfiddle.net/6yL6t/

And the code:

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();
    }
}

You could do:

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

And it will run only once :)

Improve this answer

Comments

1

Initial setup:

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;
    };
}
Improve this answer

Comments

1

If your using Node.js or writing JavaScript with browserify, consider the "once" npm module:

var once = require('once')

function load (file, cb) {
  cb = once(cb)
  loader.load('file')
  loader.once('load', cb)
  loader.once('error', cb)
}
Improve this answer

Comments

1

If you want to be able to reuse the function in the future then this works well based on ed Hopp's code above (I realize that the original question didn't call for this extra feature!):

   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();

The output look like:

Hello World!
Reset
Hello World!
Improve this answer

Comments

1

A simple example for turning on light only once.

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

This happens due to closure in JavaScript.

Improve this answer

Comments

1 
function once (fn1) {
  var ran = false
  var memo = null
  var fn = function(...args) {
    if(ran) {return memo}
    ran = true
    memo = fn1.apply(null, args)
    return memo
  }
  return fn
}
Improve this answer

Comments

1

I find it useful to just have a simple function that just returns true once, so you can keep the side effects higher up.

let once = () => !! (once = () => false);

once() // true
once() // false

Use like this:

if (once()) {
  sideEffect()
}

This exploits the fact that you can coerce an assignment expression to return true while changing the same function into a function that returns false.

If you must have it execute a function, it can be adapted using a ternary:

let once = (x) => !! (once = () => false) ? x() : false;

Now it accepts a single function as an argument. Fun fact, the second false is never reached.

Improve this answer

1 Comment

I love this - i really do. Regardless of paradigm it makes you stop and think. Juniors will have to ask what this is. +1 because im like this - but this is bad production code that wouldn't escape sensble code review in a team of >1
1

FOR EVENT HANDLER

If the function is a callback for an event listener, there is already a built-in option in the addEventListner method for just executing the callback once.

It can accept 3 parameters

  • Type
  • callback
  • options

options is an object that has a property called once

ex:

const button = document.getElementById('button');

const callbackFunc = () => {
  alert('run')
}

button.addEventListener('click', callbackFunc, { once: true }) 
<button id="button">Click Once</button>

Improve this answer

Comments

1

My preferred way of limiting the executions of a function to one (or any other number of repetitions) in various applications is using shortcircuiting.

If this was the function to be executed once only:

function maxOnce(){
                   console.log('You will never hear this again');
                  }

We delcare a countdown variable and assign it the value of 1:

let onlyOnce = 1;

The following line will call your function from the repeatable / iterable / looping section of your code:

onlyOnce == 1 && onlyOnce-- && maxOnce();

Explanation and reasons for use:

All conditions chained by the && (AND) operator need to be true in order for any of them to be "run".

The first time all conditions will be true, as onlyOnce has not been reduced to 0 yet (onlyOnce--) and the call of the maxOnce() function is true.

While a portion of developers find the if() statement method version of the above line more readable:

if(onlyOnce == 1){
   onlyOnce--;
   maxOnce();        
   }

Another portion of developers find the short circuiting method more readable in complex code. They are a) just one line of code and b) variable++ and variable-- are very easily recognisable in their iterating or limiting usage.

The advantage of assigning the counter onlyOnce the integer 1, is potentially better performance than assigning string values. This is good practice especially in functions that are often iterated or event-driven by fast streams.

(I used the wording "potentially". This question isn't predominantly about performance, so the implications of various runtime environments like browser, JIT, NodeJS or compiled, are not elaborated on here)

I personally don't like the thought of repeatedly calling "empty" or "undefined" functions as some other methods do. Maybe this is just preference...

Additional info:

Lastly - this can be easily adapted to only twice or more:

let onlyTwice = 2;

onlyTwice > 0 && onlyOnce-- && maxTwice();
Improve this answer

Comments

0

Trying to use underscore "once" function:

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

http://underscorejs.org/#once

Improve this answer

1 Comment

nah, it's too ugly when you start calling it with arguments.
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; */
Improve this answer

Comments

0 
if (!window.doesThisOnce){
  function myFunction() {
    // do something
    window.doesThisOnce = true;
  };
};
Improve this answer

4 Comments

It's a bad practice to pollute the global scope (a.k.a window)
I agree with you but someone might get something out of it.
This doesn't work. When that code is first executed, the function is created. Then when the function is called it is executed and the global is set to false, but the function can still be called a next time.
It is not set to false anywhere.
0

If you're using Ramda, you can use the function "once".

A quote from the documentation:

once Function (a… → b) → (a… → b) PARAMETERS Added in v0.1.0

Accepts a function fn and returns a function that guards invocation of fn such that fn can only ever be called once, no matter how many times the returned function is invoked. The first value calculated is returned in subsequent invocations.

var addOneOnce = R.once(x => x + 1);
addOneOnce(10); //=> 11
addOneOnce(addOneOnce(50)); //=> 11
Improve this answer

Comments

0

keep it as simple as possible

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

You can see the result

script result

Improve this answer

1 Comment

If you are inside module, just use this instead of window
0

JQuery allows to call the function only once using the method one():

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>

Implementation using JQuery method 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>

Implementation using native 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>

Improve this answer

Comments

0

Tossing my hat in the ring for fun, added advantage of memoizing

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
...
Improve this answer

Comments

0

You can use IIFE. IIFE means Immediately Invoked Function Expression and the result is to call a function only once by the time is created. Your code will be like this:

(function () {
  //The code you want to execute only one time etc...
  console.log("Hello world");
})()

Additionally, this way the data in the function remains encapsulated.
Of course and you can return values from the function and stored them into a new variable, by doing:

const/let value = (function () {
  //The code you want to execute only one time etc...
  const x = 10;
  return x;
})()
Improve this answer

Comments

0 
function x()
{
  let a=0;
  return function check()
   {
    if(!a++) 
     {
       console.log("This Function will execute Once.")
       return;
      }
     console.log("You Can't Execute it For the Second Time.")
     return;
    }
  }

 z=x()
 z() //Op - This Function will execute once
 z() //OP - You can't Execute it for the second time.
Improve this answer

Comments

1
2

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.