Dado un tiempo en segundos y la tarea es convertir el tiempo en un formato de string hh:mm:ss. Hay dos enfoques para resolver este problema:
Método 1: pasar los segundos a un objeto de fecha
- El constructor Date() espera una marca de tiempo UNIX como una de sus formas. Una marca de tiempo UNIX es un número de milisegundos que han pasado desde la época (1 de enero de 1970, 00:00:00 UTC). El número de segundos se puede dar a este constructor después de convertirlo a milisegundos.
- El tiempo en segundos se convierte en un tiempo en milisegundos multiplicándolo por 1000 . Esto se pasa al constructor Date() . El objeto Fecha creado se puede usar para acceder a las horas, minutos y segundos según lo requiera el formato.
- El valor de las horas se extrae de la fecha mediante el método getUTCHours() . El valor de los minutos en UTC se extrae de la fecha mediante el método getUTCMinutes() . El valor de los segundos se extrae de la fecha mediante el método getSeconds() .
- La fecha con formato final se crea convirtiendo cada uno de estos valores en una string mediante el método toString() y luego rellenándolos con un ‘0’ adicional , si el valor es un solo dígito mediante el método padStart() . A continuación, las partes individuales se unen con dos puntos (:) como separador. Esta string tiene el formato requerido “hh:mm:ss” .
Sintaxis:
dateObj = new Date(given_seconds * 1000);
hours = dateObj.getUTCHours();
minutes = dateObj.getUTCMinutes();
seconds = dateObj.getSeconds();
timeString = hours.toString().padStart(2, '0') + ':' +
minutes.toString().padStart(2, '0') + ':' +
seconds.toString().padStart(2, '0');
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>
How to convert seconds to time string
format hh:mm:ss using JavaScript ?
</title>
</head>
<body>
<h1 style="color: green">
GeeksforGeeks
</h1>
<b>
JavaScript | seconds to time
string with format hh:mm:ss
</b>
<p>No. of secomds is: 3685</p>
<p>
Time in hh:mm:ss is:
<span class="output"></span>
</p>
<button onclick="convertSecondstoTime()">
Get time in hh:mm:ss
</button>
<script type="text/javascript">
function convertSecondstoTime() {
given_seconds = 3685;
dateObj = new Date(given_seconds * 1000);
hours = dateObj.getUTCHours();
minutes = dateObj.getUTCMinutes();
seconds = dateObj.getSeconds();
timeString = hours.toString().padStart(2, '0')
+ ':' + minutes.toString().padStart(2, '0')
+ ':' + seconds.toString().padStart(2, '0');
document.querySelector('.output').textContent
= timeString;
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Método 2: Cálculo de las horas, minutos y segundos individualmente
- Las horas se pueden calcular dividiendo los segundos por 3600 ya que una hora equivale a 3600 segundos. Esto averiguará el número de horas. Este número se reduce al entero más cercano usando la función Math.floor() .
- Los minutos se pueden calcular encontrando la cantidad de segundos que quedan después de restar la cantidad de horas. Este valor se divide por 60 para obtener el número de minutos. Este número se reduce al entero más cercano usando la función Math.floor() .
- Los segundos se pueden calcular restando el número de segundos en el valor de los minutos y el número de segundos en el valor de las horas del total de segundos dado antes.
- La fecha con formato final se crea convirtiendo cada uno de estos valores en una string mediante el método toString() y luego rellenándolos con un ‘0’ adicional , si el valor es un solo dígito mediante el método padStart() . A continuación, las partes individuales se unen con dos puntos (:) como separador. Esta string tiene el formato requerido “hh:mm:ss” .
Sintaxis:
hours = Math.floor(given_seconds / 3600);
minutes = Math.floor((given_seconds - (hours * 3600)) / 60);
seconds = given_seconds - (hours * 3600) - (minutes * 60);
timeString = hours.toString().padStart(2, '0') + ':' +
minutes.toString().padStart(2, '0') + ':' +
seconds.toString().padStart(2, '0');
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>
How to convert seconds to time string
format hh:mm:ss using JavaScript ?
</title>
</head>
<body>
<h1 style="color: green">
GeeksforGeeks
</h1>
<b>
JavaScript | seconds to time
string with format hh:mm:ss
</b>
<p>No. of secomds is: 3685</p>
<p>
Time in hh:mm:ss is:
<span class="output"></span>
</p>
<button onclick="convertSecondstoTime()">
Get time in hh:mm:ss
</button>
<script type="text/javascript">
function convertSecondstoTime() {
given_seconds = 3685;
hours = Math.floor(given_seconds / 3600);
minutes = Math.floor((given_seconds - (hours * 3600)) / 60);
seconds = given_seconds - (hours * 3600) - (minutes * 60);
timeString = hours.toString().padStart(2, '0') + ':' +
minutes.toString().padStart(2, '0') + ':' +
seconds.toString().padStart(2, '0');
document.querySelector('.output').textContent
= timeString;
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Publicación traducida automáticamente
Artículo escrito por sayantanm19 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA