Intl.DurationFormat è ora disponibile come valore di base

Jeremy Wagner

Data di pubblicazione: 20 marzo 2025

Un'informazione comune che potresti vedere su una pagina web è un testo che indica quanto manca a un determinato evento o quanto tempo è trascorso dall'evento. In genere è rappresentato come una stringa che indica la durata in ore, minuti, secondi o altre unità di tempo utili.

Intl.DurationFormat è una funzionalità utile che esegue questa operazione nel browser, tenendo conto di eventuali esigenze di internazionalizzazione, senza la necessità di JavaScript aggiuntivo. A partire da marzo 2025, è diventato di nuova disponibilità come riferimento.

Come funziona Intl.DurationFormat

Intl.DurationFormat è una classe che, quando viene creata, restituisce una stringa che descrive la durata del tempo. Funziona specificando un oggetto contenente chiavi e valori corrispondenti alle unità di tempo per le quali vuoi generare una stringa:

// Specify the duration:
const duration = {
  years: 1,
  hours: 20,
  minutes: 15,
  seconds: 35
};

// Output: '1 yr, 20 hr, 15 min, 35 sec'
new Intl.DurationFormat('en').format(duration);

Per restituire una stringa in un formato lungo, passa un valore 'long' all'opzione style nel secondo argomento del costruttore:

const duration = {
  years: 1,
  hours: 20,
  minutes: 15,
  seconds: 35
};

// Output: '1 year, 20 hours, 15 minutes, 35 seconds'
new Intl.DurationFormat('en', { style: 'long' }).format(duration);

Finora, questi esempi generano stringhe in inglese. Poiché si tratta di una funzionalità di internazionalizzazione, la sua vera utilità è che puoi passare qualsiasi impostazioni internazionali valide e ottenere stringhe formattate nella lingua supportata di cui hai bisogno:

const duration = {
  years: 1,
  hours: 20,
  minutes: 15,
  seconds: 35
};

// Output: '1 Jahr, 20 Stunden, 15 Minuten und 35 Sekunden'
new Intl.DurationFormat('de', { style: 'long' }).format(duration);

// Output: '1 año, 20 horas, 15 minutos y 35 segundos'
new Intl.DurationFormat('es', { style: 'long' }).format(duration);

// Output: '1年20小时15分钟35秒钟'
new Intl.DurationFormat('zh', { style: 'long' }).format(duration);

// Output: '1 år, 20 timer, 15 minutter og 35 sekunder'
new Intl.DurationFormat('no', { style: 'long' }).format(duration);

// Output: 'mwaka 1, saa 20, dakika 15 na sekunde 35'
new Intl.DurationFormat('sw', { style: 'long' }).format(duration);

Questi esempi sono solo un assaggio di ciò che puoi fare con questa nuova funzionalità. Per saperne di più sulle sue funzionalità, consulta la documentazione di Intl.DurationFormat su MDN.