javascript

JavaScript: ciclo con fechas (recorrer período de tiempo)

En este post veremos cómo iterar un período de fechas con JavaScript usando un ciclo. Es decir, ir de una fecha a otra con un intervalo de días.

Con este código podremos ir de una fecha de inicio a una fecha de fin saltando entre días, horas, meses, años o cualquier período de tiempo.

Gracias a esto podremos, por ejemplo, recorrer un año saltando de semana a semana. Esto servirá para generar fechas de pagos o cualquier otra cosa interesante que necesitemos.

Explicación del algoritmo

En varios lenguajes de programación podemos representar las fechas como los segundos o milisegundos transcurridos desde la fecha Unix, es decir, el 1 de enero de 1970.

De hecho creo que todos los lenguajes lo hacen así y al final simplemente formatean esa cantidad de segundos.

Entonces para hacer un ciclo que inicia y termina en una fecha con JavaScript podemos usar ese número entero de milisegundos transcurridos para ir saltando de fecha en fecha, creando una nueva fecha en cada paso.

Nota: esto ya lo habíamos hecho con PHP hace algún tiempo.

Ciclo con fechas en JavaScript

Vamos al código con JS. Es como un ciclo for, pero en este caso la variable i es la cantidad de milisegundos.

Y en el paso de la asignación, creamos un nuevo objeto de tipo Date al cual le asignamos lo que devuelva getTime de la fecha sumando al incremento. Así de simple.

En el siguiente ejemplo vamos del 1 de enero de 2021 al 31 de diciembre de ese mismo año, incrementando semana por semana:

// https://parzibyte.me/blog
const inicio = new Date("2021-01-01T00:00:00");
const fin = new Date("2021-12-31T00:00:00");
const UN_DIA_EN_MILISEGUNDOS = 1000 * 60 * 60 * 24;
const INTERVALO = UN_DIA_EN_MILISEGUNDOS * 7; // Cada semana
const formateadorFecha = new Intl.DateTimeFormat('es-MX', { dateStyle: 'medium', });

for (let i = inicio; i <= fin; i = new Date(i.getTime() + INTERVALO)) {
 console.log(formateadorFecha.format(i));
}

La salida para el ejemplo es:

1 ene. 2021
8 ene. 2021 
15 ene. 2021
22 ene. 2021
29 ene. 2021
5 feb. 2021 
12 feb. 2021
19 feb. 2021
26 feb. 2021
5 mar. 2021 
12 mar. 2021
19 mar. 2021
26 mar. 2021
2 abr. 2021 
9 abr. 2021 
16 abr. 2021
23 abr. 2021
30 abr. 2021
7 may. 2021 
14 may. 2021
21 may. 2021
28 may. 2021
4 jun. 2021 
11 jun. 2021
18 jun. 2021
25 jun. 2021
2 jul. 2021
9 jul. 2021
16 jul. 2021
23 jul. 2021
30 jul. 2021
6 ago. 2021
13 ago. 2021
20 ago. 2021
27 ago. 2021
3 sep. 2021
10 sep. 2021
17 sep. 2021
24 sep. 2021
1 oct. 2021
8 oct. 2021
15 oct. 2021
22 oct. 2021
29 oct. 2021
5 nov. 2021
12 nov. 2021
19 nov. 2021
26 nov. 2021
3 dic. 2021
10 dic. 2021
17 dic. 2021
24 dic. 2021
31 dic. 2021

Nota: hay más formatos para la fecha. Más abajo te dejaré un enlace donde te enseño cómo formatear la fecha.

Más ejemplos

Recorrer intervalo de fechas con JavaScript – Ciclo con período de tiempo

No nos limitamos a días. También podemos recorrer un rango de fechas con JavaScript incrementando por minutos.

En el siguiente ejemplo marcamos la fecha y hora cada 45 minutos, desde el 1 de enero a medianoche hasta el 2 de enero:

// https://parzibyte.me/blog
const inicio = new Date("2021-01-01T00:00:00");
const fin = new Date("2021-01-02T00:00:00");
const UN_MINUTO_EN_MILISEGUNDOS = 1000 * 60;
const INTERVALO = UN_MINUTO_EN_MILISEGUNDOS * 45;
const formateadorFecha = new Intl.DateTimeFormat('es-MX', { dateStyle: 'medium', timeStyle: "medium" });

for (let i = inicio; i <= fin; i = new Date(i.getTime() + INTERVALO)) {
 console.log(formateadorFecha.format(i));
}

La salida ya la has visto en la imagen que acompaña al encabezado de esta sección. Como puedes ver solo es cuestión de cambiar el intervalo y jugar con los milisegundos.

Recuerda que estoy usando el formateador de fechas de JavaScript con Intl para mostrar el objeto de tipo Date de una manera amigable para el usuario.

Este código que recorre fechas con un ciclo puede ejecutarse en el navegador o en el servidor con Node, ya que al final es JS.

Por aquí te dejo más posts de JavaScript.

Estoy aquí para ayudarte 🤝💻


Estoy aquí para ayudarte en todo lo que necesites. Si requieres alguna modificación en lo presentado en este post, deseas asistencia con tu tarea, proyecto o precisas desarrollar un software a medida, no dudes en contactarme. Estoy comprometido a brindarte el apoyo necesario para que logres tus objetivos. Mi correo es parzibyte(arroba)gmail.com, estoy como@parzibyte en Telegram o en mi página de contacto

No te pierdas ninguno de mis posts 🚀🔔

Suscríbete a mi canal de Telegram para recibir una notificación cuando escriba un nuevo tutorial de programación.
parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

Entradas recientes

Imprimir ñ en impresora térmica

En este post te enseñaré a imprimir la letra ñ en una impresora térmica. Voy…

17 horas hace

Tramitar acta de nacimiento en línea de manera instantánea

En este post te quiero compartir mi experiencia tramitando un acta de nacimiento de México…

2 días hace

Creador de credenciales web – Aplicación gratuita

Hoy te voy a presentar un creador de credenciales que acabo de programar y que…

2 semanas hace

Desplegar PWA creada con Vue 3, Vite y SQLite3 en Apache

Ya te enseñé cómo convertir una aplicación web de Vue 3 en una PWA. Al…

3 semanas hace

Arquitectura para wasm con Go, Vue 3, Pinia y Vite

En este artículo voy a documentar la arquitectura que yo utilizo al trabajar con WebAssembly…

3 semanas hace

Vue 3 y Vite: crear PWA (Progressive Web App)

En un artículo anterior te enseñé a crear un PWA. Al final, cualquier aplicación que…

3 semanas hace

Esta web usa cookies.