Uso básico de MomentJS

eleyBacks2

El uso de fechas para cualquier lenguaje de programación es algo básico y en JS, siendo del lado del usuario, su uso, validación e internacionalización es más que importante.

El objeto Date de JavaScript es bastante básico y aunque hay clases que extienden sus funcionalidades aún no es suficiente. Para ello existe una librería muy útil llamada momentjs.

La documentación esta bastante bien pero aún así hay muchos ejemplos que no me quedan claros. Por ejemplo a la hora de crear un nuevo objeto lo podemos hacer de la siguiente forma:

moment(value, "MM/DD/YYYY")

o con varios formatos posibles

moment(value, ["MM/DD/YYYY", “DD/MM/YYYY”])

Es muy importante que las letras sean en mayúsculas porque el horario se define con letras en minúscula por ejemplo m.format('MM/DD/YYYY HH:mm'), asumiendo que m es la variable resultante del constructor anterior.

Se pueden concatenar funciones por ejemplo si queremos validar un campo de un formulario con un formato de fecha específico nos valdría lo siguiente: moment(value, ["MM/DD/YYYY"]).isValid().

Utilizando zonas horarias con momentjs

Si incluimos el plugin para zonas horarias (en mi caso moment-timezone-with-data-0.2.4.min.js) podremos crear fechas para una detarminada región y cambiarla de manera dinámica, por ejemplo, creemos una fecha en UTC (GMT)

var e = moment.tz(value, "MM/DD/YYYY", "UTC");

Y cambiémosla a la de Perú formateándola para que nos de la hora

e.tz('America/Lima').format('MM/DD/YYYY HH:mm')

Al igual que con Date se pueden comparar objetos momentjs con los operadores aritméticos normales (<, >, =).

Utilizando rangos de fechas

Junto con las zonas horarias el uso de rangos o intervalos de fechas me parece genial y muy práctico, lo podemos utilizar gracias al plugin adicional moment-range.js.

Primero debemos declarar el rango

var range  = moment().range(desde, hasta);

Donde las variables desde y hasta son objetos momentjs. Para comprobar si una fecha está en el rango, definimos la fecha como un objeto momentjs y ejecutamos la siguiente función:

if(range.contains(date)){
}
else{
}

¿Práctico?

Comentarios