Fechas en español con JavaScript - Curso de JavaScript de cero a máster - Capítulo 47

Fechas bien presentadas

Las fechas que nos muestra JavaScript no son muy bonitas, nos aparecen datos que no queremos. Una forma de sacar una fecha en un formato mejor presentado es mediante el uso del método toLocaleString().

Palabra del lenguaje nº 67 encontrada.
toLocaleString() es un método que nos permite mostrar las fechas en formato DD/M/AAAA, hh:mm:ss.

Código JavaScript

const ahora = new Date();
const fecha = ahora.toLocaleString();

console.log(fecha);

terminal Resultado en la consola terminal

28/2/2022, 18:04:04

Si al objeto de fecha, le pones la fecha que quieras, funciona igual, pero la tienes que escribir en formato válido, como este:

Código JavaScript

const futuro = new Date("10-1-2025, 7:03:59");
const fecha = futuro.toLocaleString();

console.log(fecha);

terminal Resultado en la consola terminal

Me devuelve un 1 de octubre de 2025, fíjate en que en el argumento al objeto de fecha, se indica primero el mes, en la salida es al revés.

1/10/2025, 7:03:59

Formatear las fechas en JavaScript con toLocaleString()

Mostrar las fechas en español y bien ordenadas es muy fácil de hacer en JavaScript. Solo hay que utilizar el mismo método que acabamos de utilizar y conocer las opciones que nos permite.

Clave Posibles valores
day "2-digit","numeric"
month "2-digit", "short", "long", "numeric"
year "2-digit", "numeric"
hour "2-digit", "numeric"
minute "2-digit","numeric"
second "2-digit", "numeric"
hour12 false, true
hourCycle "h11", "h12", "h23", "h24"
weekday "short", "long", "narrow"
timeZoneName "short", "long"
formatMatcher "basic", "best-fit" (por defecto)
timeZone
localeMatcher "best-fit", "lookup"
timeStyle "short", "long", "medium", "full"
dateStyle "short", "long", "medium", "full"

Según la tabla anterior, para mostrar una fecha como estas : 28 feb 2022 o 28 de febrero de 2022, tendremos que darle las siguientes opciones al método:

Código JavaScript

const ahora = new Date();
const fechaCorta = ahora.toLocaleString("es-ES" ,
	{day: "2-digit", month: "short", year: "numeric"});
const fechaLarga= ahora.toLocaleString("es-ES" ,
	{day: "2-digit", month: "long", year: "numeric"});

console.log(fechaCorta);
console.log(fechaLarga);

terminal Resultado en la consola terminal

28 feb 2022
28 de febrero de 2022

Si vamos a escribir varias fechas, es conveniente que guardes el valor del primer parámetro ("es-Es" para ir reutilizándolo)

Código JavaScript

const idioma = "es-Es";

const ahora = new Date();
const fechaCorta = ahora.toLocaleString(idioma,
 {day: "2-digit", month: "short", year: "numeric"});
const fechaLarga= ahora.toLocaleString(idioma,
{day: "2-digit", month: "long", year: "numeric"});

console.log(fechaCorta);
console.log(fechaLarga);

Referencia de Country codes & language de JavaScript (codigos de país y lenguaje)

En esta tabla, tienes una referencia de todos los códigos de país:

También te dejo un enlace para que veas los códigos de lenguaje, que no siempre coinciden con el código de país. Por ejemplo, "pt-PT" corresponde al idioma portugués (pt) y el país Portugal (PT), sin embargo, en Brasil se habla portugués también, en este caso, será "pt-BR".

A continuación, tienes unos cuantos ejercicios que te recomendaría hacer para que te asegures de saber utilizar correctamente todo esto.