Lewati parameter dalam fungsi setInterval


320

Mohon saran bagaimana meneruskan parameter ke fungsi yang disebut menggunakan setInterval.

Contoh saya setInterval(funca(10,3), 500);salah.


2
Sintaks:.setInterval(func, delay[, param1, param2, ...]);
O-9 9

Jawaban:


543

Anda perlu membuat fungsi anonim sehingga fungsi sebenarnya tidak segera dijalankan.

setInterval( function() { funca(10,3); }, 500 );

4
apa yang seharusnya untuk parameter dinamis?
rony36

28
@ rony36 - Anda mungkin ingin memiliki fungsi yang membuat penghitung waktu interval untuk Anda. Lewati parameter ke fungsi sehingga nilainya ditangkap dalam penutupan fungsi dan dipertahankan ketika timer kedaluwarsa. function createInterval(f,dynamicParameter,interval) { setInterval(function() { f(dynamicParameter); }, interval); }Kemudian menyebutnya sebagai createInterval(funca,dynamicValue,500); Jelas Anda dapat memperpanjang ini untuk lebih dari satu parameter. Dan, tolong, gunakan nama variabel yang lebih deskriptif. :)
tvanfosson

@tvanfosson: jawaban yang bagus! Apakah Anda tahu cara menghapus bentuk interval dalam fungsi funca?
Flo

@tvanfosson Terima kasih. Buruk saya, tapi sebenarnya saya maksud contoh createInterval yang Anda berikan di bagian komentar. Bagaimana cara kerjanya untuk itu? Saya berpikir untuk melewatkan variabel timer sebagai parameter dinamis juga, tetapi tidak yakin bagaimana atau apakah itu masuk akal. Demi kejelasan, saya menambahkan pertanyaan baru di sini: stackoverflow.com/questions/40414792/…
Flo

78

sekarang dengan ES5, ikat metode Prototipe fungsi:

setInterval(funca.bind(null,10,3),500);

Referensi di sini


2
Ini adalah jawaban terbaik, namun mungkin memiliki perilaku yang tidak terduga tergantung pada fungsinya. misalnya console.log.bind(null)("Log me")akan melempar Illegal invocation, tetapi console.log.bind(console)("Log me")akan bekerja seperti yang diharapkan. Ini karena console.logmemerlukan consolesebagai thisargumen.
Indy

1
Sejauh ini jawaban terbaik. Bersandar dan bersih. Terima kasih banyak!
Tobi

Sangat bersih dan efisien!
contactmatt

2
Cukup tambahkan yang berfungsi dengan Chrome> = 7, Firefox> = 4.0, Explorer> = 9, Opera> = 11.60, Safari> = 5.1 (Sumber: developer.mozilla.org/ca/docs/Web/JavaScript/Reference/… )
Roger Veciana

60

Tambahkan mereka sebagai parameter ke setInterval:

setInterval(funca, 500, 10, 3);

Sintaks dalam pertanyaan Anda menggunakan eval, yang bukan praktik yang disarankan.


2
Apa ?! Sejak kapan itu diizinkan? (pertanyaan serius)
Crescent Fresh

1
Tidak yakin. Sumber saya adalah: developer.mozilla.org/en/DOM/window.setInterval
Kev

2
@Kev Internet Explorer benar-benar berantakan. Ini tidak mendukung argumen yang lewat -.-
ShrekOverflow

1
IMHO ini harus menjadi jawaban yang diterima. Solusi yang bagus, sederhana dan bersih.
LightMan

32

Anda dapat melewatkan parameter sebagai properti dari objek fungsi, bukan sebagai parameter:

var f = this.someFunction;  //use 'this' if called from class
f.parameter1 = obj;
f.parameter2 = this;
f.parameter3 = whatever;
setInterval(f, 1000);

Kemudian dalam fungsi someFunctionAnda, Anda akan memiliki akses ke parameter. Ini sangat berguna di dalam kelas di mana ruang lingkup pergi ke ruang global secara otomatis dan Anda kehilangan referensi ke kelas yang disebut setInterval untuk memulai. Dengan pendekatan ini, "parameter2" di "someFunction", dalam contoh di atas, akan memiliki cakupan yang tepat.


1
Anda dapat mengakses dengan Classname.prototype.someFunction.parameter1
JoaquinG

2
Menambahkan parameter ke objek atau fungsi dapat menyebabkan kompiler melambat karena harus membangun kembali representasi kode asli objek (misalnya jika ini dilakukan dalam loop panas) jadi hati-hati.
mattdlockyer

23
     setInterval(function(a,b,c){

          console.log(a + b +c);  

      }, 500, 1,2,3);

           //note the console will  print 6
          //here we are passing 1,2,3 for a,b,c arguments
         // tested in node v 8.11 and chrome 69

Jawaban terbaik dijelaskan.
Drk_alien

Jadi mengapa melewatkan argumen sebagai array? Detail ini bahkan tidak berhubungan dengan pertanyaan.
user4642212

18

Anda dapat menggunakan fungsi anonim;

setInterval(function() { funca(10,3); },500);

1
ini panggilan yang cukup mahal!
Roy Lee

2
@Roylee Bagaimana biayanya?
user4642212

18
setInterval(function,milliseconds,param1,param2,...)

Pembaruan: 2018 - gunakan operator "spread"

function repeater(param1, param2, param3){
   alert(param1);
   alert(param2);
   alert(param3); 
}

let input = [1,2,3];
setInterval(repeater,3000,...input);


Ini jauh lebih baik.
Ugur Kazdal

Ini jauh lebih baik.
Ugur Kazdal

11

Sejauh ini jawaban yang paling praktis adalah yang diberikan oleh tvanfosson, yang bisa saya lakukan adalah memberi Anda versi terbaru dengan ES6:

setInterval( ()=>{ funca(10,3); }, 500);

1
Apakah Anda mengatakan bahwa () => {} adalah cara baru ES6 untuk mengganti fungsi () {}? Menarik. Pertama, saya pikir roket itu ketinggalan jaman. Dan, kecuali sintaks ini memiliki kegunaan umum lainnya, itu hanya sangat, sangat aneh. Saya melihat mereka adalah "panah gemuk". Tetap saja aneh. Saya kira seseorang menyukainya dan ini masalah pendapat.
Richard_G

6

Mengutip argumen harus cukup:

OK --> reloadIntervalID = window.setInterval( "reloadSeries('"+param2Pass+"')" , 5000)

KO --> reloadIntervalID = window.setInterval( "reloadSeries( "+param2Pass+" )" , 5000)

Catat kutipan tunggal 'untuk setiap argumen.

Diuji dengan IE8, Chrome dan FireFox


7
Menggunakan eval adalah praktik yang mengerikan. Penggunaan fungsi anonim jauh lebih baik.
SuperIRis

1

Saya tahu topik ini sudah sangat tua tetapi ini adalah solusi saya untuk melewatkan parameter dalam setIntervalfungsi.

Html:

var fiveMinutes = 60 * 2;
var display = document.querySelector('#timer');
startTimer(fiveMinutes, display);

JavaScript:

function startTimer(duration, display) {
    var timer = duration,
        minutes, seconds;

    setInterval(function () {
        minutes = parseInt(timer / 60, 10);
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds;
        --timer; // put boolean value for minus values.

    }, 1000);
}

saya perlu mengakses nilai satu kali saat memanggil fungsi, tetapi tidak setiap detik, jadi jawaban Anda memberikan ini, (misalnya timer), tetapi bagaimana Anda clearInterval()dalam skenario ini?
user1063287

0

Ini berhasil setInterval("foo(bar)",int,lang);.... Jon Kleiser menuntun saya ke jawabannya.


0

Solusi lain terdiri atas fungsi Anda seperti itu (jika Anda punya dinamika vars): setInterval ('funca (' + x + ',' + y + ')', 500);


0

Anda dapat menggunakan perpustakaan yang disebut underscore js. Ini memberikan pembungkus yang bagus pada metode bind dan sintaks yang jauh lebih bersih juga. Memungkinkan Anda menjalankan fungsi dalam cakupan yang ditentukan.

http://underscorejs.org/#bind

_.bind (fungsi, lingkup, * argumen)


0

Masalah itu akan menjadi demonstrasi yang bagus untuk penggunaan penutupan. Idenya adalah bahwa suatu fungsi menggunakan variabel lingkup luar. Berikut ini sebuah contoh ...

setInterval(makeClosure("Snowden"), 1000)

function makeClosure(name) {
var ret

ret = function(){
    console.log("Hello, " + name);
}

return ret;
}

Fungsi "makeClosure" mengembalikan fungsi lain, yang memiliki akses ke "nama" variabel lingkup luar. Jadi, pada dasarnya, Anda perlu meneruskan variabel apa pun untuk fungsi "makeClosure" dan menggunakannya dalam fungsi yang ditetapkan untuk variabel "ret". Secara efektif, setInterval akan menjalankan fungsi yang ditetapkan untuk "ret".


0

Saya memiliki masalah yang sama dengan aplikasi Vue. Dalam kasus saya, solusi ini hanya berfungsi jika fungsi anonim telah dideklarasikan sebagai fungsi panah, terkait deklarasi di mounted ()hook lingkaran kehidupan.

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.