Fungsi di JavaScript yang hanya bisa dipanggil sekali

Saya perlu membuat fungsi yang hanya dapat dijalankan sekali, setiap kali setelah yang pertama tidak akan dijalankan. Saya tahu dari C ++ dan Java tentang variabel statis yang dapat melakukan pekerjaan itu tetapi saya ingin tahu apakah ada cara yang lebih elegan untuk melakukan ini?

Jika dengan "tidak akan dieksekusi" yang Anda maksud "tidak akan melakukan apa-apa saat dipanggil lebih dari sekali", Anda dapat membuat penutupan:

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

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

Sebagai jawaban atas komentar @Vladloffe (sekarang dihapus): Dengan variabel global, kode lain dapat menyetel ulang nilai dari tanda "dieksekusi" (apa pun nama yang Anda pilih). Dengan penutupan, kode lain tidak memiliki cara untuk melakukan itu, baik secara tidak sengaja atau sengaja.

Seperti jawaban lain yang ditunjukkan di sini, beberapa pustaka (seperti Underscore dan Ramda ) memiliki fungsi utilitas kecil (biasanya bernama once()^[*] ) yang menerima fungsi sebagai argumen dan mengembalikan fungsi lain yang memanggil fungsi yang disediakan tepat sekali, terlepas dari bagaimana caranya berkali-kali fungsi yang dikembalikan dipanggil. Fungsi yang dikembalikan juga menyimpan nilai yang pertama kali dikembalikan oleh fungsi yang disediakan dan mengembalikannya pada panggilan berikutnya.

Namun, jika Anda tidak menggunakan pustaka pihak ketiga seperti itu, tetapi masih menginginkan fungsi utilitas seperti itu (daripada solusi nonce yang saya tawarkan di atas), cukup mudah untuk diterapkan. Versi terbaik yang pernah saya lihat adalah yang ini diposting oleh David Walsh :

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

Saya akan cenderung untuk berubah fn = null;menjadi fn = context = null;. Tidak ada alasan bagi penutupan untuk mempertahankan referensi ke contextsekali fntelah dipanggil.

^[*] _{Namun, ketahuilah, bahwa pustaka lain, seperti ekstensi Drupal ke jQuery ini , mungkin memiliki fungsi bernama once()yang melakukan sesuatu yang sangat berbeda.}

Gantilah dengan fungsi NOOP (tanpa operasi) yang dapat digunakan kembali .

// 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
}

Arahkan ke fungsi kosong setelah dipanggil:

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>

Atau, seperti:

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)

UnderscoreJs memiliki fungsi yang melakukan itu, 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;
    };
  };

Berbicara tentang variabel statis, ini sedikit mirip dengan varian penutupan:

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

once(); once(); 

Anda kemudian dapat mengatur ulang suatu fungsi jika Anda ingin:

once.done = false;

var quit = false;

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

Anda bisa saja memiliki fungsi "menghapus dirinya sendiri"

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

    Once = undefined;
}

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

Tapi ini mungkin bukan jawaban terbaik jika Anda tidak ingin salah menelan.

Anda juga bisa melakukan ini:

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

    Once = function(){};
}

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

Saya membutuhkannya untuk bekerja seperti smart pointer, jika tidak ada elemen dari tipe A maka dapat dijalankan, jika ada satu atau lebih elemen A, fungsinya tidak dapat dijalankan.

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

    // do stuff
}

coba ini

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

Dari beberapa pria bernama Crockford ... :)

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

Reusable invalidatefungsi yang bekerja dengan 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);

Cobalah di JSBin: https://jsbin.com/vicipar/edit?js,console

Variasi jawaban dari Bunyk

Berikut adalah contoh JSFiddle - http://jsfiddle.net/6yL6t/

Dan kodenya:

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

Anda bisa melakukan:

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

Dan itu akan berjalan hanya sekali :)

Pengaturan awal:

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

Jika Anda menggunakan Node.js atau menulis JavaScript dengan browserify, pertimbangkan modul npm "Once" :

var once = require('once')

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

Jika Anda ingin dapat menggunakan kembali fungsi tersebut di masa mendatang, maka ini berfungsi dengan baik berdasarkan kode ed Hopp di atas (Saya menyadari bahwa pertanyaan asli tidak memerlukan fitur tambahan ini!):

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

Outputnya terlihat seperti:

Hello World!
Reset
Hello World!

dekorator sederhana yang mudah ditulis saat Anda membutuhkan

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

menggunakan:

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

initializer() // 'initializing'
initializer() // nop
initializer() // nop

Mencoba menggunakan fungsi garis bawah "sekali":

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

http://underscorejs.org/#once

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; */

Jika Anda menggunakan Ramda, Anda dapat menggunakan fungsi "sekali" .

Kutipan dari dokumentasi:

Once Function (a… → b) → (a… → b) PARAMETERS Ditambahkan dalam v0.1.0

Menerima fungsi fn dan mengembalikan fungsi yang menjaga pemanggilan fn sedemikian rupa sehingga fn hanya dapat dipanggil sekali, tidak peduli berapa kali fungsi yang dikembalikan tersebut dipanggil. Nilai pertama yang dihitung dikembalikan dalam pemanggilan berikutnya.

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

buat sesederhana mungkin

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

Anda bisa lihat hasilnya

JQuery memungkinkan untuk memanggil fungsi hanya sekali menggunakan metode 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>

Implementasi menggunakan metode JQuery pada () :

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>

Implementasi menggunakan JS asli:

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>

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

Yang ini berguna untuk mencegah loop tak terbatas (menggunakan jQuery):

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

Jika Anda khawatir tentang polusi namespace, gantikan string acak yang panjang untuk "doIt".

Ini membantu mencegah eksekusi yang lengket

var done = false;

function doItOnce(func){
  if(!done){
    done = true;
    func()
  }
  setTimeout(function(){
    done = false;
  },1000)
}