Programma JavaScript per creare un timer per il conto alla rovescia

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

Articoli interessanti...