Lecciones
Comenzar
Empezar a aprender
CodeGym /Cursos /Frontend SELF ES /Date. Formateo de fechas y números

Date. Formateo de fechas y números

Frontend SELF ES
Nivel 37 , Lección 1
Disponible

2.1 Objeto Date

Trabajar con fechas y números es una parte importante del desarrollo de aplicaciones web. JavaScript proporciona objetos y métodos integrados para manipular fechas y números. En esta conferencia, exploraremos el objeto Date, sus métodos y formas de formatear fechas y números.

El objeto Date en JavaScript representa fecha y hora. Tiene una gran cantidad de métodos para trabajar con fechas, incluyendo obtener la fecha y hora actuales, establecer la fecha y hora, así como formatear.

Creación del objeto Date

¡Importante!
Si creas un objeto Date() sin parámetros, contendrá la fecha y hora actual — el momento de su creación.

Puedes crear un objeto Date de varias maneras.

1. Fecha y hora actuales:

JavaScript
    
      const now = new Date();

      console.log(now); // Muestra la fecha y hora actual

2. Establecer una fecha y hora específica:

JavaScript
    
      const specificDate = new Date('2024-07-07T10:00:00');

      console.log(specificDate); // Muestra la fecha 7 de julio de 2024
Java university

3. Establecer fecha y hora utilizando valores numéricos:

JavaScript
    
      const anotherDate = new Date(2024, 6, 7, 10, 0, 0);

      console.log(anotherDate); // Muestra la fecha 7 de julio de 2024

2.2 Métodos del objeto Date()

Obtener componentes de la fecha:

  • getFullYear(): obtener el año (cuatro dígitos)
  • getMonth(): obtener el mes (de 0 a 11)
  • getDate(): obtener el día del mes (de 1 a 31)
  • getHours(): obtener la hora (de 0 a 23)
  • getMinutes(): obtener los minutos (de 0 a 59)
  • getSeconds(): obtener los segundos (de 0 a 59)

Ejemplo:

JavaScript
    
      const now = new Date();

      console.log(now.getFullYear()); // Año actual
      console.log(now.getMonth()); // Mes actual (-1)
      console.log(now.getDate()); // Día actual
      console.log(now.getHours()); // Hora actual
      console.log(now.getMinutes()); // Minuto actual
      console.log(now.getSeconds()); // Segundo actual

Establecer componentes de la fecha:

  • setFullYear(year): establecer el año
  • setMonth(month): establecer el mes
  • setDate(day): establecer el día del mes
  • setHours(hours): establecer la hora
  • setMinutes(minutes): establecer los minutos
  • setSeconds(seconds): establecer los segundos

Ejemplo:

JavaScript
    
      const date = new Date();

      date.setFullYear(2025);
      date.setMonth(0); // Enero
      date.setDate(15);
      date.setHours(12);
      date.setMinutes(30);
      date.setSeconds(45);

      console.log(date.toString());

2.3 Formateo de fechas

JavaScript proporciona métodos para formatear fechas en cadenas. El método más popular es toLocaleDateString() para formatear la fecha según la localización.

Ejemplo de uso de toLocaleDateString():

JavaScript
    
      const now = new Date();

      console.log(now.toLocaleDateString('en-US')); // "7/7/2024" (MM/DD/YYYY)
      console.log(now.toLocaleDateString('en-GB')); // "07/07/2024" (DD/MM/YYYY)
      console.log(now.toLocaleDateString('ru-RU')); // "07.07.2024" (DD.MM.YYYY)

Método toLocaleTimeString()

El método toLocaleTimeString() devuelve la hora en formato de cadena local:

JavaScript
    
const now = new Date();

console.log(now.toLocaleTimeString('en-CA')); 
console.log(now.toLocaleTimeString('en-GB'));

Método toLocaleString()

El método toLocaleString() devuelve la fecha y la hora en formato de cadena local:

JavaScript
    
      const now = new Date();

      console.log(now.toLocaleString('en-CA')); 
      console.log(now.toLocaleString('en-GB'));

Método toISOString()

El método toISOString() devuelve la fecha y la hora en formato ISO 8601:

JavaScript
    
      const now = new Date();

      console.log(now.toISOString()); // "2023-07-05T10:00:00.000Z"

2.4 Formateo de números

Método toLocaleString()

El método toLocaleString() permite formatear números según la configuración local:

JavaScript
    
      const number = 1234567.89;

      console.log(number.toLocaleString()); // "1,234,567.89" en formato de EE.UU. o "1 234 567,89" en formato local
      console.log(number.toLocaleString('de-DE')); // "1.234.567,89" en formato de Alemania

Formateo de números con Intl.NumberFormat

El constructor Intl.NumberFormat te proporciona aún más flexibilidad para formatear números:

JavaScript
    
      const number = 1234567.89;

      const usFormatter = new Intl.NumberFormat('en-US');
      console.log(usFormatter.format(number)); // "1,234,567.89"

      const deFormatter = new Intl.NumberFormat('de-DE');
      console.log(deFormatter.format(number)); // "1.234.567,89"

      const customFormatter = new Intl.NumberFormat('en-US', {
        style: 'currency',
        currency: 'USD'
      });

      console.log(customFormatter.format(number)); // "$1,234,567.89"
Comentarios
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION