paint-brush
Agregue intervalos de tiempo en JavaScript de manera fácilpor@anwarhjg
740 lecturas
740 lecturas

Agregue intervalos de tiempo en JavaScript de manera fácil

por AHJ George4m2024/01/13
Read on Terminal Reader

Demasiado Largo; Para Leer

Tiene una cadena de parte de horas, un jefe flotante y JavaScript. El problema: desea sumar las horas y evitar que su jefe se quede dando vueltas. La Solución: No requiere brujería.
featured image - Agregue intervalos de tiempo en JavaScript de manera fácil
AHJ George HackerNoon profile picture
0-item

No necesitarás ninguno de estos suministros de brujería para completar este tutorial. Imagen del autor.



Huuuuf. Una opresión fría recorre tu columna vertebral.


Haaaaah. El aliento gélido de tu jefe te baña el cuello como una alcantarilla desbordada. Pero no puedes decirles que se queden en otro lugar... te han estado observando como un halcón desde que se rompió el sistema de seguimiento del tiempo de la oficina.


Ahora, simplemente están ahí... flotando... respirando. Huffff.


Intentaste escribir tus horas en una hoja de horas, pero tu jefe está bastante ocupado con toda esa respiración. ¿Qué pasa si no hicieron bien los cálculos y agregaron mal sus horas?


Aquí se explica cómo tomar el asunto en sus propias manos con JavaScript. Haaaaa .

El problema

Tiene una hoja de horas que se parece al contenido de esta String :

 const a = `November 30 2023 13:20-15:00, 15:30-16:40 December 4 2023 15:45-16:15, December 5 2023 08:00-08:30, 18:15-19:30, 21:45-22:15, 22:30-23:00 December 6 2023 19:45-21:45 December 7 2023 14:15-14:45, 15:15-15:45, 16:00-16:30, 16:45-17:15, 18:45-20:15, 20:45-22:45 December 13 2023 03:00-03:50 December 15 2023 09:00-09:30 20:30-21:15 21:45-22:30 23:30-24:00 December 16 2023 23:25-23:55 December 17 2023 19:05-19:50 20:30-21:30 22:15-23:45 December 20 2023 23:30-24:00 December 21 2023 02:20-2:50 03:15-03:30 13:40-14:00 16:00-17:15 17:45-18:45 19:20-20:10 21:30-22:20 23:00 - 24:00 December 22 2023 0:00-0:15`;


Cada línea contiene una fecha seguida de algunos intervalos de tiempo. Pero no están escritos de manera muy clara: algunos intervalos están separados por comas, otros tienen espacios irregulares, etc.


Dadas estas inconsistencias, probablemente sea bueno no asumir otras garantías. Por ejemplo, ¿quién dice que todas las horas serán del mismo año? Nadie, ese es quién. Desea sumar las horas de la forma más sólida posible.

La solución

Esto es bastante fácil. Comenzamos creando un par de expresiones regulares y una función auxiliar. Entonces, simplemente… ¡Huuuuffh!


¡¡Puaj!! ¡Jefe, relájese en algún lugar por un segundo!


Como decía, ahora podemos completar la tarea con un algoritmo de tres pasos:


  1. Dividimos la cadena de la hoja de horas en líneas individuales y las reducimos para crear una serie de objetos.


  2. Para cada iteración, nosotros:

    A. Divida la línea alrededor del año usando yearRegex , registrando la cadena de fecha.

    B. Recopile todos los intervalos de rango de tiempo utilizando intervalsRegex

    C. Reducir los rangos de tiempo, analizando cada uno como un objeto de fecha de JavaScript utilizando el asistente parseDate y la cadena de fecha del paso 2.A.


  3. Reducir la variedad de objetos para encontrar el total de horas.


 const yearRegex = /(\d{4})/gi; const intervalsRegex = /(\d+\:\d+)\s*-\s*(\d+\:\d+)/gi; const parseDate = (date, time) => Date.parse(`${date} ${time}`); let times = [...a.split("\n")].reduce((arr, entryLine) => { let entryLineSplit = entryLine.split(yearRegex); let o = { date: entryLineSplit[0] + entryLineSplit[1], timeRanges: [...entryLine.matchAll(intervalsRegex)], }; o.hoursForDay = o.timeRanges.reduce((total, [x, start, end]) => { let s = parseDate(o.date, start); let e = parseDate(o.date, end); return total + (e - s) / 1000 / 60 / 60; }, 0); return [...arr, o]; }, []); console.log(times); let totalHours = times.reduce((total, { hoursForDay }) => total + hoursForDay, 0); console.log(totalHours);


Si descomentas console.log(times); declaración, verá una matriz que contiene objetos como:

 { date: 'November 30 2023', timeRanges: [ [ '13:20-15:00', '13:20', '15:00', index: 17, input: 'November 30 2023 13:20-15:00, 15:30-16:40', groups: undefined ], [ '15:30-16:40', '15:30', '16:40', index: 30, input: 'November 30 2023 13:20-15:00, 15:30-16:40', groups: undefined ] ], totalHours: 2.8333333333333335 },

Los beneficios de este método

Construir una serie de objetos tiene algunas ventajas distintivas sobre simplemente extraer los intervalos de tiempo y agregarlos.


  • Facilita el recorrido después del hecho. Esto es ideal si quieres hacer algo como graficar tus tiempos diarios.


  • Guardar la cadena de fecha para cada registro permite el uso de métodos aritméticos de fecha JS integrados luego de una llamada a Date.parse .


  • El objeto es un lugar conveniente para almacenar los resultados de llamar String.prototype.split , que puede no ser único dependiendo de si dos días incluyeron los mismos intervalos de tiempo.

Desventajas de este método

Esta solución no es perfecta:

  • Requiere dos grandes recorridos: uno sobre el resultado de dividir la hoja de horas y luego otro sobre el objeto times . Para optimizar este código, probablemente sería mejor usar una reducción única sobre un objeto vacío que contenga totalHours y times como campos.


  • Utiliza expresiones regulares que pueden volverse más complicadas con un formato más complejo.

Terminando

Ahora sabes cómo extraer tiempo de una hoja de horas desordenada. Con un poco de esfuerzo extra, incluso podrías construir un reloj de tiempo completo. Pero entonces no podrías pasar todo ese tiempo de calidad conociendo a tu jefe, ¿verdad? Hufff.