Lezioni
Inizia
Inizia il corso
CodeGym /Corsi /Frontend SELF IT /Date. Formattazione di date e numeri

Date. Formattazione di date e numeri

Frontend SELF IT
Livello 37 , Lezione 1
Disponibile

2.1 Oggetto Date

Lavorare con date e numeri è una parte fondamentale nello sviluppo di applicazioni web. JavaScript offre oggetti e metodi integrati per manipolare date e numeri. In questa lezione esamineremo l'oggetto Date, i suoi metodi e i modi di formattare date e numeri.

L'oggetto Date in JavaScript rappresenta la data e l'ora. Esso possiede molti metodi per lavorare con le date, compresi ottenere la data e l'ora attuali, impostare una data e un'ora, oltre alla formattazione.

Creazione di un oggetto Date

Importante!
Se crei un oggetto Date() senza parametri, esso conterrà la data e l'ora attuali — il momento della sua creazione.

Puoi creare un oggetto Date in diversi modi.

1. Data e ora attuali:

JavaScript
    
      const now = new Date();

      console.log(now); // Mostra la data e ora attuali

2. Impostazione di una data e ora specifica:

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

      console.log(specificDate); // Mostra la data del 7 luglio 2024

3. Impostazione di data e ora usando valori numerici:

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

      console.log(anotherDate); // Mostra la data del 7 luglio 2024

2.2 Metodi dell'oggetto Date()

Ottenere i componenti della data:

  • getFullYear(): ottieni l'anno (quattro cifre)
  • getMonth(): ottieni il mese (da 0 a 11)
  • getDate(): ottieni il giorno del mese (da 1 a 31)
  • getHours(): ottieni le ore (da 0 a 23)
  • getMinutes(): ottieni i minuti (da 0 a 59)
  • getSeconds(): ottieni i secondi (da 0 a 59)

Esempio:

JavaScript
    
      const now = new Date();

      console.log(now.getFullYear()); // Anno corrente
      console.log(now.getMonth()); // Mese corrente (-1)
      console.log(now.getDate()); // Giorno corrente
      console.log(now.getHours()); // Ora corrente
      console.log(now.getMinutes()); // Minuti correnti
      console.log(now.getSeconds()); // Secondi correnti

Impostare i componenti della data:

  • setFullYear(year): imposta l'anno
  • setMonth(month): imposta il mese
  • setDate(day): imposta il giorno del mese
  • setHours(hours): imposta le ore
  • setMinutes(minutes): imposta i minuti
  • setSeconds(seconds): imposta i secondi

Esempio:

JavaScript
    
      const date = new Date();

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

      console.log(date.toString());

2.3 Formattazione delle date

JavaScript offre metodi per formattare le date in stringhe. Il metodo più popolare è toLocaleDateString() per formattare la data in base alla localizzazione.

Esempio di utilizzo di 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)

Metodo toLocaleTimeString()

Il metodo toLocaleTimeString() restituisce l'ora sotto forma di stringa in un formato localizzato:

JavaScript
    
const now = new Date();

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

Metodo toLocaleString()

Il metodo toLocaleString() restituisce la data e l'ora sotto forma di stringa in un formato localizzato:

JavaScript
    
      const now = new Date();

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

Metodo toISOString()

Il metodo toISOString() restituisce la data e l'ora nel formato ISO 8601:

JavaScript
    
      const now = new Date();

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

2.4 Formattazione dei numeri

Metodo toLocaleString()

Il metodo toLocaleString() consente di formattare i numeri secondo le impostazioni locali:

JavaScript
    
      const number = 1234567.89;

      console.log(number.toLocaleString()); // "1,234,567.89" nel formato americano o "1 234 567,89" nel formato locale
      console.log(number.toLocaleString('de-DE')); // "1.234.567,89" nel formato tedesco

Formattazione dei numeri con Intl.NumberFormat

Il costruttore Intl.NumberFormat ti offre opzioni ancora più flessibili per formattare i numeri:

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"
Commenti
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION