Format Date en JavaScript: Qué es y cómo funciona

Autor: | Última modificación: 21 de marzo de 2024 | Tiempo de Lectura: 3 minutos
Temas en este post:

Algunos de nuestros reconocimientos:

Premios KeepCoding

Hoy nos vamos a sumergir en el fascinante mundo de JavaScript, específicamente en una herramienta esencial para cualquier desarrollador web: el manejo de fechas. Y sí, estamos hablando de cómo usar format date en Javascript. Si alguna vez te has preguntado cómo transformar esas líneas de código en fechas comprensibles y manejables, estás en el lugar correcto. Así que, vamos a desglosar este tema de una forma sencilla, pero enriquecedora.

¿Qué es Format Date en JavaScript?

Format date en javascript

Primero lo primero. El format date en Javascript se refiere al proceso de convertir la información de fecha y hora, que por defecto viene en un formato de texto (String), a un formato más legible o adecuado según nuestras necesidades. JavaScript, este lenguaje que tanto amamos y a veces nos hace querer arrancarnos los cabellos, genera por defecto las fechas en un formato estándar: Mon Jan 15 2020 14:22:55 GMT-0300. Pero, ¿qué sucede si necesitamos mostrar esta fecha en un formato distinto, digamos dd/mm/yyyy? Aquí es donde entra en juego nuestra habilidad para usar format date en Javascript.

ISO 8601: El estándar internacional

Antes de meternos de lleno en los códigos y las transformaciones, hablemos un poco sobre ISO 8601. Esta norma internacional es la más utilizada para la representación de fechas y horas. Su sintaxis, YYYY-MM-DD, es posiblemente el formato que más veces has visto. Pero, ¿cómo se ve esto en práctica en nuestro querido JavaScript?

const dataIso = new Date("2020-05-15"); 
console.log(dataIso);

Al ejecutar este código, la consola nos devuelve algo como esto: Thu May 14 2020 21:00:00 GMT-0300. Así es, hemos creado nuestra fecha en el formato estándar ISO, pero hay un detalle importante aquí: la zona horaria. Por defecto, JavaScript maneja las zonas horarias basándose en la configuración de nuestro navegador, lo que nos lleva al siguiente punto.

Manejando zonas horarias

La gestión de las zonas horarias es crucial cuando trabajamos con fechas en JavaScript. De forma predeterminada, si no especificamos una zona horaria, JavaScript usará la del navegador del usuario. Esto significa que la misma fecha puede representarse de manera diferente dependiendo de dónde se encuentre el usuario. Entonces, ¿cómo podemos manejarlo? Aquí entran en juego los formatos de fecha.

Formatos de fecha en JavaScript

Básicamente, tenemos tres tipos de formatos de fecha:

  1. ISO Date: Ya lo mencionamos, es el estándar internacional (YYYY-MM-DD).
  2. Short Date: Un formato más corto, usualmente MM/DD/YYYY.
  3. Long Date: Un formato más descriptivo, como «Jun 12 2014» o «12 Jun 2014».

Cada uno de estos formatos tiene sus peculiaridades y su forma de implementación en JavaScript. Pero lo importante aquí es saber que tenemos opciones, y mucho depende del contexto en el que estemos trabajando.

¿Cómo formatear fechas en JavaScript?

Ahora que tenemos una idea clara de lo que implica el format date en Javascript, vamos a lo práctico. JavaScript, a través de sus objetos Date, nos permite manipular, crear y formatear fechas de varias maneras. Sin embargo, a veces necesitamos un poco más de control o formatos específicos como dd/mm/yyyy, y aquí es donde entran en juego bibliotecas externas como Moment.js o métodos nativos como toLocaleDateString().

Ejemplo práctico: Formato DD/MM/YYYY

Imagina que quieres convertir una fecha en el formato dd/mm/yyyy. Podrías hacer algo así:

let fecha = new Date(); 
let formatoDeseado = fecha.getDate() + "/" + (fecha.getMonth() + 1) + "/" + fecha.getFullYear(); 
console.log(formatoDeseado);

Este simple snippet nos permite transformar la fecha actual al formato deseado. ¡Y así de fácil es empezar a manipular format date en Javascript!

Dominar el format date en Javascript habilidad fundamental para cualquier desarrollador web. No solo nos permite presentar datos de manera más amigable y comprensible para el usuario, sino que también nos ayuda a manejar y almacenar fechas de manera eficiente en nuestras aplicaciones. Desde el formato ISO estándar hasta conversiones personalizadas como dd/mm/yyyy, entender cómo trabajar con fechas en JavaScript abre un mundo de posibilidades.

Si estás listo para dar ese salto y transformar tu futuro, el Desarrollo Web Full Stack Bootcamp de KeepCoding es tu punto de partida. Nuestro bootcamp está diseñado para transformarte en uno gran profesional, dándote no solo el conocimiento técnico, sino también las habilidades prácticas que necesitas para sobresalir. Y lo mejor de todo, al finalizar el bootcamp, no solo habrás cambiado de carrera, habrás cambiado tu vida. Anímate a seguir aprendiendo con KeepCoding.

Artículos ms leídos

¡CONVOCATORIA ABIERTA!

Desarrollo Web

Full Stack Bootcamp

Clases en Directo | Profesores en Activo | Temario 100% actualizado