Dalam tutorial ini, anda akan belajar mengenai kaedah JavaScript setInterval () dengan bantuan contoh.
Dalam JavaScript, sekumpulan kod dapat dijalankan dalam selang waktu yang ditentukan. Selang masa ini disebut peristiwa masa.
Terdapat dua kaedah untuk melaksanakan kod pada selang waktu tertentu. Mereka adalah:
- setInterval ()
- setTimeout ()
Dalam tutorial ini, anda akan mengetahui setInterval()kaedahnya.
Set JavaScriptInterval ()
The setInterval()Cara mengulangi satu blok kod di setiap peristiwa masa diberikan.
Sintaks JavaScript setInterval yang biasa digunakan adalah:
setInterval(function, milliseconds);
Parameternya adalah:
- function - fungsi yang mengandungi blok kod
- milisaat - selang masa antara pelaksanaan fungsi
The setInterval()Cara mengembalikan intervalID yang merupakan integer positif.
Contoh 1: Paparkan Teks Sekali Setiap Detik
// program to display a text using setInterval method function greet() ( console.log('Hello world'); ) setInterval(greet, 1000);
Pengeluaran
Hello world Hello world Hello world Hello dunia …
Dalam program di atas, setInterval()kaedah memanggil greet()fungsi setiap 1000 milisaat ( 1 saat).
Oleh itu program ini memaparkan teks Hello world setiap 1 saat.
Catatan : setInterval()Kaedah ini berguna apabila anda ingin mengulang sekatan kod beberapa kali. Contohnya, menunjukkan mesej pada selang masa yang tetap.
Contoh 2: Waktu Paparan Setiap 5 Saat
// program to display time every 5 seconds function showTime() ( // return new date and time let dateTime= new Date(); // return the time let time = dateTime.toLocaleTimeString(); console.log(time) ) let display = setInterval(showTime, 5000);
Pengeluaran
"5:15:28 PM" "5:15:33 PM" "5:15:38 PM"….
Program di atas memaparkan waktu semasa 5 saat sekali.
new Date()memberikan tarikh dan masa semasa. Dan toLocaleTimeString()mengembalikan masa sekarang. Untuk mengetahui lebih lanjut mengenai tarikh dan masa, lawati Tarikh dan Waktu JavaScript.
Jelas JavaScript Jeda ()
Seperti yang anda lihat dalam contoh di atas, program ini melaksanakan sekatan kod pada setiap selang waktu yang ditentukan. Sekiranya anda ingin menghentikan panggilan fungsi ini, maka anda boleh menggunakan clearInterval()kaedahnya.
Sintaks clearInterval()kaedah adalah:
clearInterval(intervalID);
Di sini, intervalIDadalah nilai pulangan setInterval()kaedah.
Contoh 3: Gunakan kaedah clearInterval ()
// program to stop the setInterval() method after five times let count = 0; // function creation let interval = setInterval(function()( // increasing the count by 1 count += 1; // when count equals to 5, stop the function if(count === 5)( clearInterval(interval); ) // display the current time let dateTime= new Date(); let time = dateTime.toLocaleTimeString(); console.log(time); ), 2000);
Pengeluaran
4:47:41 PM 4:47:43 PM 4:47:45 PM 4:47:47 PM 4:47:49 PM
Dalam program di atas, setInterval()kaedah tersebut digunakan untuk menampilkan waktu semasa setiap 2 saat. The clearInterval()kaedah berhenti fungsi panggilan selepas 5 kali.
Anda juga boleh menyampaikan argumen tambahan kepada setInterval()kaedah tersebut. Sintaksnya adalah:
setInterval(function, milliseconds, parameter1,… .paramenterN);
Apabila anda lulus parameter tambahan kepada setInterval()kaedah, parameter ini ( parameter1, parameter2, dan lain-lain) akan diserahkan kepada yang dinyatakan fungsi .
Sebagai contoh,
// program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setInterval setInterval(greet, 1000, 'John', 'Doe');
Pengeluaran
Hello John Doe Hello John Doe Hello John Doe….
Dalam program di atas, dua parameter Johndan Doediteruskan ke setInterval()kaedah. Kedua parameter ini adalah argumen yang akan diteruskan ke fungsi (di sini, greet()fungsi) yang ditentukan dalam setInterval()kaedah.
Catatan: Jika anda hanya perlu menjalankan fungsi satu kali, lebih baik menggunakan metode setTimeout ().
