Formatos de fechas y horas en Javascript
Fernando Chata
Posted on August 2, 2020
Ojalá las cosas fuesen simples al hablar de fechas, lo común es:
const date = new Date();
console.log(date);
// Sun Aug 02 2020 14:54:33 GMT-0400 (hora estándar de Chile)
Usando toLocaleDateString()
Claro tanto texto no se vería bien, si queremos "embellecer" nuestros formatos de salida debemos usar toLocaleDateString() y obtendremos algo como:
const formatFullDate = date.toLocaleDateString()
// 2/8/2020
mejor, pero quería la versión larga, entonces le agregamos algunas opciones:
const formatFullDate = date.toLocaleDateString("es-CL", {
weekday: "long", // narrow, short
year: "numeric", // 2-digit
month: "short", // numeric, 2-digit, narrow, long
day: "numeric" // 2-digit
});
console.log(formatFullDate);
// domingo, 2 de ago. de 2020
ahí si, como se ven existen varias opciones, veamos
- es-CL: corresponde al idioma y al país
- narrow: devuelve la primera letra, por ejemplo, si fuese un domingo el resultado es sería una letra "D"
- long: devuelve la palabra completa
- short: devuelve la versión corta de la palabra, en el ejemplo devolvería la abreviación "dom"
- 2-digit: obliga a devolver dos dígitos, si el día es menor de 10 devuelve el dia con un cero adelante, en caso de los años, devuelve los dos últimos dígitos
Si nos encontrasemos en EEUU el resultado sería:
const formatFullDate = date.toLocaleDateString("en-ES", {
weekday: "long", // narrow, short
year: "numeric", // 2-digit
month: "short", // numeric, 2-digit, narrow, long
day: "numeric" // 2-digit
});
// Sunday, Aug 2, 2020
como se ve el formato inglés es diferente al formato español.
Usando toLocaleTimeString()
Ahora veamos las horas, para esto se usa toLocaleTimeString()
const form = date.toLocaleTimeString();
// 16:05:04
bien, bien, pero quizá queramos ver el AM o PM, o quizá nuestro país tiene diferentes zonas de horarias, por ejemplo en Chile, donde vivo, tenemos la Isla de Pascua, allá tienen dos hora de diferencia dependiendo del horario de invierno o verano, entonces tendré que agregar algunas opciones:
// hora continental - Santiago de Chile
const formatFullTime = date.toLocaleTimeString("es-CL", {
timeZone: "America/Santiago",
hour12: true, // false
hour: "numeric", // 2-digit
minute: "2-digit", // numeric
second: "2-digit" // numeric
});
console.log(formatFullTime);
// 4:28:45 p. m.
// hora insular - Isla de Pascua
const formatFullTime = date.toLocaleTimeString("es-CL", {
timeZone: "Pacific/Easter",
hour12: true, // false
hour: "numeric", // 2-digit
minute: "2-digit", // numeric
second: "2-digit" // numeric
});
console.log(formatFullTime);
// 2:28:45 p. m.
encontramos nuevas opciones, como:
- timeZone: corresponde a la hora horaria que queremos visualizar, por ejemplo en Estados Unidos sería algo como "America/Los_angeles" o "America/New_york"
- hour12: si queremos visualizar la hora en formato de 12 horas (agregando el AM o PM) la opción será "true" o en caso contrario de 24 horas
Posted on August 2, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.