In questo esempio, imparerai a scrivere un programma JavScript che creerà un timer per il conto alla rovescia.
Per comprendere questo esempio, è necessario conoscere i seguenti argomenti di programmazione JavaScript:
- JavaScript Math floor ()
- Data e ora JavaScript
- Javascript setInterval ()
Esempio: creare un timer per il conto alla rovescia
// program to create a countdown timer // time to countdown from (in milliseconds) let countDownDate = new Date().getTime() + 24 * 60 * 60 * 1000; // countdown timer let x = setInterval(function() ( // get today's date and time in milliseconds let now = new Date().getTime(); // find the interval between now and the countdown time let timeLeft = countDownDate - now; // time calculations for days, hours, minutes and seconds const days = Math.floor( timeLeft/(1000*60*60*24) ); const hours = Math.floor( (timeLeft/(1000*60*60)) % 24 ); const minutes = Math.floor( (timeLeft/1000/60) % 60 ); const seconds = Math.floor( (timeLeft/1000) % 60 ); // display the result in the element with console.log(days + "d " + hours + "h " + minutes + "m " + seconds + "s "); // clearing countdown when complete if (timeLeft < 0) ( clearInterval(x); console.log('CountDown Finished'); ) ), 2000);
Produzione
0d 23h 59m 57s 0d 23h 59m 55s 0d 23h 59m 53s 0d 23h 59m 51s …
Nel programma sopra, il setInterval()
metodo viene utilizzato per creare un timer.
Il setInterval()
metodo viene eseguito in un determinato intervallo di tempo (qui, 2000 millisecondi).
Il new Date()
dà la data e l'ora corrente. Per esempio,
let d1 = new Date(); console.log(time); // Fri Aug 28 2020 09:19:40 GMT+0545 (+0545)
Il getTime()
metodo restituisce il numero di millisecondi dalla mezzanotte del 1 gennaio 1970 (epoca EcmaScript) alla data specificata (qui, data corrente).
Il codice seguente fornisce l'ora del giorno successivo in millisecondi.
new Date().getTime() + 24 * 60 * 60 * 1000;
Ora, possiamo calcolare il tempo rimanente utilizzando la seguente formula:
let timeLeft = countDownDate - now;
Il numero di giorni rimanenti viene calcolato utilizzando:
- L'intervallo di tempo viene diviso per 1000 per determinare il numero di secondi, ad es
timeLeft / 1000
- L'intervallo di tempo viene quindi diviso per 60 * 60 * 24 per determinare il numero di giorni rimanenti.
- La
Math.floor()
funzione viene utilizzata per arrotondare il numero a un numero intero.
Metodi simili vengono utilizzati per ore, minuti e secondi.
Nota : puoi anche utilizzare un conto alla rovescia iniziale personalizzato passando una data specifica.
Per esempio,
let countDownDate = new Date("Aug 5, 2025 14:22:36").getTime();