Formatear una fecha en JavaScript

Harshit Jindal 12 octubre 2023
  1. Dar formato a datos de JavaScript usando toTimeString() en JavaScript
  2. Formatear un dato JavaScript usando toUTCString() en JavaScript
  3. Formatear un dato JavaScript usando toDateString() en JavaScript
  4. Formatear un dato JavaScript usando toLocaleString() en JavaScript
  5. Formatear un dato JavaScript usando toLocaleTimeString() en JavaScript
  6. Utilice las funciones personalizadas para dar formato a la fecha en JavaScript
  7. Utilice el paquete Moment.js con Node.js para formatear la fecha en JavaScript
  8. Utilice el paquete dateformat con Node.js
Formatear una fecha en JavaScript

Este tutorial explica cómo formatear una fecha de JavaScript.

Podemos obtener la fecha y hora actuales utilizando el objeto Date de JavaScript. Podemos formatear la fecha escribiendo nuestras propias funciones personalizadas y usando bibliotecas como moment.js.

Primero, creamos una variable llamada date usando el objeto Date para obtener la fecha y hora actuales.

var date = new Date();

Mostraremos el resultado de todas las funciones de formato aplicadas a esta variable.

Dar formato a datos de JavaScript usando toTimeString() en JavaScript

toTimeString() ayuda a extraer solo la cadena que contiene información sobre el tiempo de la variable date.

var date = new Date();
result = date.toTimeString();
console.log(result);

Producción :

"20:07:37 GMT+0100 (Central European Standard Time)"

Formatear un dato JavaScript usando toUTCString() en JavaScript

Este método devuelve la hora media de Greenwich o la hora universal coordinada a partir de la hora actual del país almacenada en la variable.

var date = new Date();
result = date.toUTCString();
console.log(result);

Producción :

"Thu, 18 Mar 2021 19:09:40 GMT"

Formatear un dato JavaScript usando toDateString() en JavaScript

Este método extrae la fecha y la devuelve en forma de cadena.

var date = new Date();
result = date.toDateString();
console.log(result);

Producción :

"Thu Mar 18 2021"

Formatear un dato JavaScript usando toISOString() en JavaScript

Devuelve una cadena que contiene la fecha/hora en formato ISO 8601.

var date = new Date();
result = date.toISOString();
console.log(result);

Producción :

"2021-03-18T19:11:35.957Z"

Formatear un dato JavaScript usando toLocaleString() en JavaScript

Convierte el objeto de fecha en una cadena utilizando la configuración regional.

var date = new Date();
result = date.toLocaleString();
console.log(result);

Producción :

"3/18/2021, 8:13:03 PM"

Formatear un dato JavaScript usando toLocaleTimeString() en JavaScript

Convierte el objeto de fecha pero extrae solo la hora en una cadena utilizando la configuración regional.

var date = new Date();
result = date.toLocaleTimeString();
console.log(result);

Producción :

"8:14:22 PM"

Utilice las funciones personalizadas para dar formato a la fecha en JavaScript

Formato de fecha dd-mm-yyyy o dd/mm/yyyy y patrones similares

Usamos los métodos getDate(), getMonth() y getFullYear() para obtener las partes de la fecha en partes y concatenarlas usando el símbolo que queramos y en el orden que queramos.

Por ejemplo, podemos obtener dd/mm/yyyy, dd-mm-yyyy, mm-dd-yyyy, mm/yyyy de la forma que queramos escribiendo una función personalizada como la que hemos escrito a continuación.

var date = new Date();
const formatDate = (date) => {
  let formatted_date =
      date.getDate() + '-' + (date.getMonth() + 1) + '-' + date.getFullYear()
  return formatted_date;
} console.log(formatDate(date));

Producción :

"18-3-2021"

También podemos poner el nombre del mes como January, February, March, dentro de la cadena de fecha.

var date = new Date();
const months = [
  'JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV',
  'DEC'
];

const formatDate = (date) => {
  let formatted_date =
      date.getDate() + '-' + months[date.getMonth()] + '-' + date.getFullYear()
  return formatted_date;
} console.log(formatDate(date));

Producción :

"18-MAR-2021"

Formato de fecha yy-mm-dd hh:mm:ss y patrones similares

Usamos todos los métodos getDate(), getMonth() y getFullYear(), getHour(), getminutes(), getsecond() para obtener las partes de fecha y hora individualmente y concatenarlos usando el símbolo que queramos y en el orden que queramos.

var date = new Date();

const formatDate =
    (current_datetime) => {
      let formatted_date = current_datetime.getFullYear() + '-' +
          (current_datetime.getMonth() + 1) + '-' + current_datetime.getDate() +
          ' ' + current_datetime.getHours() + ':' +
          current_datetime.getMinutes() + ':' + current_datetime.getSeconds();
      return formatted_date;
    }

                          console.log(formatDate(date));

Producción :

"2021-3-18 20:21:2"

Utilice el paquete Moment.js con Node.js para formatear la fecha en JavaScript

Se considera la mejor biblioteca de fecha y hora en JavaScript. Es fácil de usar y no es necesario memorizar y construir todas estas funciones diferentes. Los usuarios pueden escribir fácilmente una plantilla de cadena de acuerdo con sus necesidades de formato.

const moment = require('moment');
let m = moment();
m.format('[Time: ] h:mm:ss a');  // output of the form `Time: 11:39:03 pm`

El código anterior demuestra una de las formas en que moment.js nos permite formatear la fecha y la hora usando Node REPL.

Utilice el paquete dateformat con Node.js

Otro paquete como Moment.js puede ayudarnos a formatear la fecha. Funciona con Node.js y Browser-side JavaScript. Extiende el objeto Date al incluir un método .format().

Lado del navegador

Day = new Date();
Day.format('dd-m-yy');  // Returns '16-3-21'

El código anterior muestra la simplicidad de usar el paquete dateformat con el objeto Date.

Node.js

const dateformat = require('dateformat');
let now = new Date();
dateformat(now, 'dddd, mmmm dS, yyyy, h:MM:ss TT');  // returns 'Tuesday, March
                                                     // 16th, 2021, 11:32:08 PM'

El código anterior demuestra el uso del paquete dateformat para formatear la fecha con Node REPL.

Harshit Jindal avatar Harshit Jindal avatar

Harshit Jindal has done his Bachelors in Computer Science Engineering(2021) from DTU. He has always been a problem solver and now turned that into his profession. Currently working at M365 Cloud Security team(Torus) on Cloud Security Services and Datacenter Buildout Automation.

LinkedIn

Artículo relacionado - JavaScript Date