Por mucho tiempo he estado utilizando herramientas como moment.js y date-fns para formatear fechas, pero desde que aprendí a formatear fechas con javascript he dejado de usarlas, aquí te cuento cómo y ¡en una línea de código!
La manera más fácil de formatear una fecha para muchos es hacer npm install moment.js. Pero hay formas nativas en javascript de hacerlo, así que no siempre necesitamos una librería para formatear fechas en javascript.
Nos podemos valer de los métodos del objeto Date en javascript. Un método muy útil es toLocaleDateString.
Este método toma recibe varios parámetros que son locales y options. Para comprobar que tiene compatibilidad del navegador puedes seguir esta guía: Comprobando el soporte para los argumentos locales y options.
Te dejo un ejemplo utilizando los locales de mi país 👇
new Date().toLocaleDateString('es-DO', { weekday: 'long', year: 'numeric', month: 'short', day: 'numeric'})// lunes, 19 de jul. de 2021Cómo formatear fechas en javascript
Obtener la fecha en JavaScript no suele ser un problema, pero formatear estas fechas para que se adapten a nuestros proyectos puede resultar una tarea muy difícil para los principiantes. Debido a esto, la mayoría de las personas terminan usando bibliotecas.
El método más utilizado para obtener la fecha en JavaScript es el objeto Date.
De forma predeterminada, cuando ejecuta new Date() en su terminal, utiliza la zona horaria de su navegador y muestra la fecha como una cadena de texto completo, como Mon Jul 19 2021 11:10:04 GMT-0400 (Atlantic Standard Time).
Pero tener algo como esto en nuestra página web o aplicación no es profesional y no es fácil de leer. Así que esto te obliga a buscar mejores formas de formatear estas fechas.
Echemos un vistazo a algunos métodos que utiliza el objeto Date.
Métodos para formatear fechas
Hay tantos métodos que puedes utilizar con un objeto de fecha en javascript. Puedes utilizar estos métodos para obtener información de un objeto de fecha.
Éstos son algunos de ellos:
getFullYear()obtiene el año como un número de cuatro dígitos (yyyy)getMonth()obtiene el mes como un número (0-11)getDate()obtiene el día como un número (1-31)getHours()obtiene la hora (0-23)
Desafortunadamente, la mayoría de estos métodos todavía necesitan mucho código para convertir las fechas al formato que deseamos. Por esa razón muchos tienden a utilizar una librería para evitar escribir mucho código.
La ventaja de que hayan tantos te permite analizar cuál se adapta más a tu proyecto y no limitarte solo a una librería que ya está definida.
Mis métodos favoritos y su uso práctico
toLocaleDateString()
Este método devuelve el objeto Date como un string utilizando convenciones locales. También toma opciones como argumentos que te permetirán personalizar el comportamiento de la función.
Sintaxis:
toLocaleDateString()toLocaleDateString(locales)toLocaleDateString(locales, options)Uso práctico: Formatear una fecha a la fecha local de mi país
new Date().toLocaleDateString('es-DO', { weekday: 'long', year: 'numeric', month: 'short', day: 'numeric'})// lunes, 19 de jul. de 2021toISOString()
El método toISOString() devuelve una cadena en el formato simplificado extendido ISO (ISO 8601), que siempre mide 24 o 27 caracteres de largo.
Sintaxis
dateObj.toISOString()Uso práctico: Formatear una fecha a fecha SQL
new Date().toISOString().split('T')[0]// 2021-07-19Conclusiones
El objeto de fecha tiene aproximadamente siete métodos de formato. Lo que nos da la libertad de realizar cosas avanzadas sin necesidad de utilizar una librería.
Si quieres aprender más sobre como formatear fechas en javascript, te dejo estos recursos (en inglés) 👇
- Everything You Need to Know About Date in JavaScript
- JavaScript - How to Format Date in JavaScript
- How to format a date in JavaScript
- The Definitive Guide to DateTime Manipulation
Si este artículo te ha servido, compartelo con tus amigos. Hasta otra entrega, pequeño byte !
