Run Javascript code only once, and with only one spot to put the code

Question

I have an interceptor function that I can put some javascript code into (for swagger ui). I only have one place to put in javascript code and it will be re-run frequently. I need to add a mutating observer in there, and have it only be setup one time.

There are many examples of how to do a Javascript method that will allow your code to be only run once. Here is a popular example: Function in JavaScript that can be called only once

But it assumes that you have somewhere to put the function where it will only be called once.

Is there a way to have my javascript code (not necessarily a function) only be run once? (So I don't end up setting up a bunch of mutating observers?)

To illustrate with an example, here is the code from the question I linked to, but copied in twice to show that it would be run many times:

var something = (function() {
    var executed = false;
    return function() {
        if (!executed) {
            executed = true;
            console.log("hello");
        }
    };
})();

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

var something = (function() {
    var executed = false;
    return function() {
        if (!executed) {
            executed = true;
            console.log("hello");
        }
    };
})();

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

The output of this code is:

hello
hello

Because the function is initalized twice, the call to console.log happens twice.

I need some way to have my code only happen once, with only one place to declare it.

I don't think there is anything you can do about this if there is no way to keep state. But I'm not familiar with swagger. — Felix Kling, Oct 20 '21 at 18:40
As @FelixKling said "[...] if there is no way to keep state". Can you use LocalStorage/... to keep the state of `var executed = false;`? (e.g. `const executed = !! localStorage.getItem('executed')`) — A_A, Oct 20 '21 at 18:43
Why would this run many times? AFAIK, Swagger (I assume you mean the page it generates) doesn't reload the page by itself. Unless you reload the page. And I also assume you want to do the setup if the page is reloaded. So, it should be possible to just have a stateful function. At the very least, you can attach the function or flag on `window`, so it's global. But I'm not sure I understand the problem. — VLAZ, Oct 20 '21 at 18:52

score 1 · Answer 1 · answered Oct 20 '21 at 18:55

For browser environment, you can use localStorage to set the value.

// make sure to initialize with true in your main entry point, otherwise the function would not run for the first time
localStorage.setItem('run-function', true);


const run = localStorage.getItem('run-function');

function test() {
    if (run) {
        console.log('ran function');
        // ran once, set the value to false to prevent dupes
        localStorage.setItem('run-function', false);
    } else {
        console.log('function already called once, exiting');
    }
}


test();

if you're on node.js environment you can make use of the global variable

// make sure to initialize with true in your main entry point, otherwise the function would not run for the first time

global.run_function = true;



function test() {
    if (global.run_function) {
        console.log('ran function');
        global.run_function = false;
    } else {
        console.log('function already called once, exiting');
    }
}


test();

score 1 · Accepted Answer · answered Oct 20 '21 at 18:58

What about storing executed value in document ... it is created once at execution ... it could be stored in window (i.e. global var) but I think it is better to be kept in document. I'm not familiar with swagger but docuument should always exits I think. Storing it in localStorage will keep it longer than you may need and you should reset it on each run.

var something = (function() {
    return function() {
        if (!document.executed) {
            document.executed = true;
            console.log("hello");
        }
    };
})();

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

var something = (function() {
    return function() {
        if (!document.executed) {
            document.executed = true;
            console.log("hello");
        }
    };
})();

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

Run Javascript code only once, and with only one spot to put the code

2 Answers2

Linked