Quasi ogni tipo di applicazione scritta in JavaScript funziona con orari o date in qualche modo. All'inizio, questo era limitato all'API Date integrata. Questa API include funzionalità di base, ma è piuttosto limitata in ciò che può fare. Le librerie di terze parti come Moment.js e successivamente le API integrate come le API Intl e la nuova API Temporal, aggiungono maggiore flessibilità all'utilizzo di orari e date. L'ascesa e la caduta di Moment.js Moment.js è una libreria JavaScript con potenti utilità per lavorare con orari e date. Include funzionalità mancanti dell'API Date di base, come la manipolazione del fuso orario, e semplifica molte operazioni comuni. Moment include anche funzioni per la formattazione di date e orari. È diventata una libreria ampiamente utilizzata in molte applicazioni diverse. Tuttavia, Moment aveva anche la sua parte di problemi. È una libreria di grandi dimensioni e può aumentare in modo significativo le dimensioni del pacchetto di un'applicazione. Poiché la libreria non supporta il tree shaker (una funzionalità dei moderni bundler che può rimuovere parti inutilizzate delle librerie), l'intera libreria Moment è inclusa anche se utilizzi solo una o due delle sue funzioni. Un altro problema con Moment è il fatto che gli oggetti che crea sono mutabili. Chiamare determinate funzioni su un oggetto Moment ha effetti collaterali e modifica il valore di quell'oggetto. Ciò può portare a comportamenti o bug imprevisti. Nel 2020, i manutentori di Moment hanno deciso di mettere la libreria in modalità di manutenzione. Non è in corso lo sviluppo di nuove funzionalità e i manutentori sconsigliano di utilizzarla per nuovi progetti. Esistono altre librerie di date JavaScript, come date-fns, ma c'è un nuovo player in città, un'API integrata direttamente in JavaScript: Temporal. È un nuovo standard che colma i buchi dell'API Date originale e risolve alcune delle limitazioni riscontrate in Moment e altre librerie. Cos'è il temporale? Temporal è una nuova API di data e ora aggiunta allo standard ECMAScript, che definisce il moderno JavaScript. Nel marzo 20266, ha raggiunto la fase 4 del processo TC39 (il comitato che supervisiona le proposte e le aggiunte al linguaggio JavaScript) e sarà incluso nella prossima versione delle specifiche ECMAScript. È già stato implementato in diversi browser: Chrome 144+ e Firefox 139+, con Safari che dovrebbe seguire presto. È disponibile anche un polyfill per browser non supportati e Node.js. L'API Temporale crea oggetti che, generalmente, rappresentano momenti nel tempo. Possono essere timestamp a tempo pieno e data in un determinato fuso orario oppure possono essere un'istanza generica dell'ora dell'"orologio da parete" senza alcuna informazione sul fuso orario o sulla data. Alcune delle caratteristiche principali di Temporal includono:
Orari con o senza date. Un oggetto temporale può rappresentare un'ora specifica in una data specifica o un'ora senza informazioni sulla data. Può essere rappresentata anche una data specifica, senza ora. Supporto del fuso orario. Gli oggetti temporali riconoscono completamente il fuso orario e possono essere convertiti in diversi fusi orari. Moment supporta anche i fusi orari, ma richiede la libreria aggiuntiva moment-timezone. Immutabilità.Una volta creato un oggetto temporale, non può essere modificato. Le conversioni aritmetiche del tempo o del fuso orario non modificano l'oggetto sottostante. Invece, generano un nuovo oggetto Temporale. Indicizzazione basata su 1. Una fonte comune di bug con l'API Date (così come con Moment) è che i mesi sono indicizzati a zero. Ciò significa che gennaio è il mese 0, anziché il mese 1 come tutti comprendiamo nella vita reale. Temporale risolve questo problema utilizzando l'indicizzazione basata su 1: gennaio è il mese 1. È integrato nel browser. Poiché Temporal è un'API nel browser stesso, non aggiunge nulla alla dimensione del bundle della tua applicazione.
È anche importante notare che l’API Date non scomparirà. Sebbene Temporal sostituisca questa API, non verrà rimossa né deprecata. Molte applicazioni si bloccherebbero se i browser rimuovessero improvvisamente l'API Date. Tuttavia, tieni presente anche che Moment è ora considerato un progetto legacy in modalità di manutenzione. Nel resto dell'articolo esamineremo alcune "ricette" per la migrazione del codice basato su Moment alla nuova API Temporal. Iniziamo il refactoring! Creazione di oggetti data e ora Prima di poter manipolare date e ore, dobbiamo creare oggetti che le rappresentino. Per creare un oggetto Moment che rappresenta la data e l'ora correnti, utilizzare la funzione moment. const adesso = momento(); console.log(ora); // Momento<2026-02-18T21:26:29-05:00>
Questo oggetto può ora essere formattato o manipolato secondo necessità.
// converte in UTC //attenzione: questo modifica l'oggetto Moment e lo mette in modalità UTC! console.log(now.utc()); // Momento<2026-02-19T02:26:29Z>
// stampa una stringa formattata: nota che ora sta utilizzando l'ora UTC console.log(now.format('MM/GG/AAAA hh:mm:ss a')); // 19/02/2026 02:27:07
La cosa fondamentale da ricordare su Moment è che un oggetto Moment include sempre informazioni sull'ora e sulla data. Se è necessario lavorare solo con le informazioni sull'ora, in genere va bene, ma può causare comportamenti imprevisti in situazioni come l'ora legale o gli anni bisestili, in cui la data può avere effetto sui calcoli dell'ora. Il temporale è più flessibile. È possibile creare un oggetto che rappresenta la data e l'ora correnti creando un oggetto Temporal.Instant. Ciò rappresenta un punto nel tempo definito dal tempo trascorso da "l'epoca" (mezzanotte UTC del 1 gennaio 1970). Temporal può fare riferimento a questo istante nel tempo con una precisione a livello di nanosecondi. const now = Temporale.Ora.instant();
// visualizza i nanosecondi grezzi dall'epoca console.log(now.epochNanoseconds); // 1771466342612000000n
// formato per UTC console.log(now.toString()); // 2026-02-19T01:55:27.844Z
// formato per un particolare fuso orario console.log(now.toString({timeZone: 'America/New_York' })); // 2026-02-18T20:56:57.905-05:00
Gli oggetti Temporal.Instant possono anche essere creati per una data e un'ora specifiche utilizzando il metodo from statico.
const mioInstant = Temporale.Instant.from('2026-02-18T21:10:00-05:00');
// Formatta l'istante nel fuso orario locale. Tieni presente che questo controlla solo // la formattazione: non modifica l'oggetto come fa moment.utc. console.log(myInstant.toString({timeZone: 'America/New_York' })); // 2026-02-18T21:10:00-05:00
Puoi anche creare altri tipi di oggetti temporali, tra cui:
Temporal.PlainDate: una data senza informazioni sull'ora. Temporal.PlainTime: ora senza informazioni sulla data. Temporal.ZonedDateTime: data e ora in un fuso orario specifico.
Ognuno di questi ha un metodo from che può essere chiamato con un oggetto che specifica la data e/o l'ora, o una stringa di data da analizzare. // Solo un appuntamento const oggi = Temporal.PlainDate.from({ anno: 2026, mese: 2, // nota che stiamo usando 2 per febbraio giorno: 18 }); console.log(today.toString()); // 18-02-2026
// Solo una volta const LunchTime = Temporal.PlainTime.from({ ora: 12 }); console.log(lunchTime.toString()); // 12:00:00
// Una data e un'ora nel fuso orario degli Stati Uniti orientali const dueAt = Temporal.ZonedDateTime.from({ fuso orario: 'America/New_York', anno: 2026, mese: 3, giorno: 1, ora: 12, minuto: 0, secondo: 0 }); console.log(dueAt.toString()); // 2026-03-01T12:00:00-05:00[America/New_York]
Analisi Abbiamo trattato la creazione programmatica di informazioni su data e ora. Ora diamo un'occhiata all'analisi. L'analisi è un'area in cui Moment è più flessibile rispetto all'API Temporal integrata. Puoi analizzare una stringa di data passandola alla funzione moment. Con un singolo argomento, Moment prevede una stringa di data ISO, ma puoi utilizzare formati alternativi se fornisci un secondo argomento che specifica il formato della data da utilizzare.
const isoData = momento('2026-02-21T09:00:00'); const formattedDate = moment('2/21/26 9:00:00', 'M/G/AA h:mm:ss');
console.log(isoData); // Momento<21-02-2026T09:00:00-05:00>
console.log(dataformattata); // Momento<21-02-2026T09:00:00-05:00>
Nelle versioni precedenti, Moment faceva la migliore ipotesi per analizzare qualsiasi stringa di data formattata arbitrariamente. Ciò potrebbe portare a risultati imprevedibili. Ad esempio, 02-03-2026 è il 2 febbraio o il 3 marzo? Per questo motivo, le versioni più recenti di Moment mostrano un avviso di deprecazione ben visibile se viene richiamato senza una stringa di data in formato ISO (a meno che non venga fornito anche il secondo argomento con il formato desiderato). Temporal analizzerà solo una stringa di data specificatamente formattata. La stringa deve essere conforme al formato ISO 8601 o alla sua estensione, RFC 9557. Se una stringa di data non conforme viene passata a un metodo from, Temporal genererà un RangeError.
// Utilizzando una stringa di data RFC 9557 const miaData = Temporale.Instant.from('2026-02-21T09:00:00-05:00[America/New_York]'); console.log(myDate.toString({timeZone: 'America/New_York' })); // 21-02-2026T09:00:00-05:00
// Utilizzando una stringa di data sconosciuta const otherDate = Temporal.Instant.from('2/21/26 9:00:00'); // RangeError: errore temporale: carattere non valido durante l'analisi del valore dell'anno.
I requisiti esatti della stringa della data dipendono dal tipo di oggetto temporale che stai creando. Nell'esempio precedente, Temporal.Instant richiede un ISO completo8601 o RFC 9557 che specifica la data e l'ora con una differenza di fuso orario, ma puoi anche creare oggetti PlainDate o PlainTime utilizzando solo un sottoinsieme del formato data. const miaData = Temporal.PlainDate.from('2026-02-21'); console.log(myDate.toString()); // 21-02-2026
const miaOra = Temporal.PlainTime.from('09:00:00'); console.log(myTime.toString()); // 09:00:00
Tieni presente che queste stringhe devono comunque essere conformi al formato previsto, altrimenti verrà generato un errore.
// Utilizzo di stringhe temporali non conformi. Tutti questi genereranno un RangeError. Temporal.PlainTime.from('9:00'); Temporal.PlainTime.from('9:00:00');
Suggerimento da professionista: gestione di stringhe non ISO Poiché Temporal dà priorità all'affidabilità, non tenterà di indovinare il formato di una stringa come 02-01-2026. Se la tua origine dati utilizza tali stringhe, dovrai eseguire alcune manipolazioni delle stringhe per riorganizzare i valori in una stringa ISO come 2026-02-01 prima di tentare di utilizzarla con Temporal.
Formattazione Una volta che hai un oggetto Moment o Temporale, probabilmente ad un certo punto vorrai convertirlo in una stringa formattata. Questo è un esempio in cui Moment è un po' più conciso. Chiami il metodo format dell'oggetto con una stringa di token che descrivono il formato della data desiderato. data const = momento();
console.log(data.format('MM/GG/AAAA')); // 22/02/2026
console.log(date.format('MMMM Do AAAA, h:mm:ss a')); // 22 febbraio 2026, 20:18:30
D'altra parte, Temporal richiede che tu sia un po' più prolisso. Gli oggetti temporali, come Instant, dispongono di un metodo toLocaleString che accetta varie opzioni di formattazione specificate come proprietà di un oggetto.
data const = Temporal.Now.instant();
// senza argomenti, otterremo il formato predefinito per la locale corrente console.log(date.toLocaleString()); // 22/02/2026, 20:23:36 (presupponendo che la locale sia en-US)
// passa le opzioni di formattazione per generare una stringa di formato personalizzata console.log(date.toLocaleString('en-US', { mese: 'lungo', giorno: 'numerico', anno: 'numerico', ora: '2 cifre', minuto: '2 cifre' })); // 22 febbraio 2026 alle 20:23
// passa solo i campi desiderati nella stringa di formato console.log(date.toLocaleString('en-US', { mese: 'breve', giorno: 'numerico' })); // 22 febbraio
La formattazione della data temporale utilizza effettivamente l'API Intl.DateTimeFormat (già disponibile nei browser moderni) dietro le quinte. Ciò significa che puoi creare un oggetto DateTimeFormat riutilizzabile con le tue opzioni di formattazione personalizzate, quindi passare gli oggetti temporali al relativo metodo di formato. Per questo motivo, non supporta formati di data personalizzati come fa Moment. Se hai bisogno di qualcosa come "Q1 2026" o altra formattazione specializzata, potresti aver bisogno di un codice di formattazione della data personalizzato o di ricorrere a una libreria di terze parti. const formattatore = new Intl.DateTimeFormat('en-US', { mese: '2 cifre', giorno: "2 cifre", anno: 'numerico' });
data const = Temporal.Now.instant(); console.log(formatter.format(data)); // 22/02/2026
I token di formattazione di Moment sono più semplici da scrivere, ma non sono compatibili con le impostazioni locali. Il formato stringe elementi "hard code" come l'ordine mese/giorno. Il vantaggio di utilizzare un oggetto di configurazione, come fa Temporal, è che si adatterà automaticamente a qualsiasi locale e utilizzerà il formato corretto. data const = Temporal.Now.instant();
const formatoOpzioni = { mese: 'numerico', giorno: 'numerico', anno: 'numerico' };
console.log(date.toLocaleString('en-US', formatOptions)); // 22/02/2026
console.log(date.toLocaleString('en-GB', formatOptions)); // 22/02/2026
Calcoli della data In molte applicazioni, dovrai finire per eseguire alcuni calcoli in una data. Potresti voler aggiungere o sottrarre unità di tempo (giorni, ore, secondi, ecc.). Ad esempio, se disponi della data corrente, potresti voler mostrare all'utente la data tra 1 settimana da adesso. Gli oggetti Momento dispongono di metodi come addizione e sottrazione che eseguono queste operazioni. Queste funzioni accettano un valore e un'unità, ad esempio: add(7, 'giorni'). Una differenza molto importante tra Moment e Temporal, tuttavia, è che quando si eseguono questi calcoli di data, l'oggetto sottostante viene modificato e il suo valore originale viene perso. const adesso = momento();
console.log(ora); // Momento<2026-02-24T20:08:36-05:00>
const nextWeek = now.add(7, 'giorni'); console.log(prossima settimana); // Momento<2026-03-03T20:08:36-05:00>
// Capito: l'oggetto originale è stato mutato console.log(ora); // Momento<2026-03-03T20:08:36-05:00>
Per evitare di perdere la data originale, puoi chiamare clone sull'oggetto Moment per crearne una copia. const ora= momento(); const nextWeek = now.clone().add(7, 'giorni');
console.log(ora); // Momento<2026-02-24T20:12:55-05:00>
console.log(prossima settimana); // Momento<2026-03-03T20:12:55-05:00>
D'altra parte, gli oggetti temporali sono immutabili. Dopo aver creato un oggetto come Instant, PlainDate e così via, il valore di quell'oggetto non cambierà mai. Gli oggetti temporali hanno anche metodi di aggiunta e sottrazione. Temporale è un po' esigente riguardo a quali unità di tempo possono essere aggiunte a quali tipi di oggetti. Ad esempio, non puoi aggiungere giorni a un istante:
const now = Temporale.Ora.instant(); const nextWeek = now.add({ giorni: 7 }); // RangeError: errore temporale: l'unità più grande non può essere un'unità di data
Questo perché gli oggetti istantanei rappresentano un momento specifico in UTC e sono indipendenti dal calendario. Poiché la durata di un giorno può cambiare in base alle regole del fuso orario come l'ora legale, questo calcolo non è disponibile su un istante. Puoi, tuttavia, eseguire questa operazione su altri tipi di oggetti, come PlainDateTime: const now = Temporal.Now.plainDateTimeISO(); console.log(now.toLocaleString()); // 24/02/2026, 20:23:59
const nextWeek = now.add({ giorni: 7 });
// Nota che il PlainDateTime originale rimane invariato console.log(now.toLocaleString()); // 24/02/2026, 20:23:59
console.log(nextWeek.toLocaleString()); // 3/3/2026, 20:23:59
Puoi anche calcolare quanto tempo intercorre tra due oggetti Momento o Temporali. Con la funzione diff di Moment, devi fornire un'unità per la granularità, altrimenti restituirà la differenza in millisecondi. data const1 = momento('2026-02-21T09:00:00'); data const2 = momento('2026-02-22T10:30:00');
console.log(data2.diff(data1)); //91800000
console.log(date2.diff(data1, 'giorni')); // 1
Per fare ciò con un oggetto Temporale, puoi passare un altro oggetto Temporale ai suoi metodi Until o Since. Ciò restituisce un oggetto Temporal.Duration contenente informazioni sulla differenza oraria. L'oggetto Duration ha proprietà per ciascun componente della differenza e può anche generare una stringa di durata ISO 8601 che rappresenta la differenza oraria.
data const1 = Temporal.PlainDateTime.from('2026-02-21T09:00:00'); data const2 = Temporal.PlainDateTime.from('2026-02-22T10:30:00');
//largestUnit specifica l'unità di tempo più grande da rappresentare // nel calcolo della durata const diff = date2.since(date1, {più grandeUnità: 'giorno' });
console.log(diff.giorni); // 1
console.log(diff.ore); // 1
console.log(diff.minuti); // 30
console.log(diff.toString()); // P1DT1H30M // (stringa di durata ISO 8601: 1 giorno, 1 ora, 30 minuti)
Confronto di date e orari Moment e Temporal ti consentono entrambi di confrontare date e orari per determinare quale viene prima dell'altro, ma adottano approcci diversi con l'API. Moment fornisce metodi come isBefore, isAfter e isSame per confrontare due oggetti Moment. data const1 = momento('2026-02-21T09:00:00'); data const2 = momento('2026-02-22T10:30:00');
console.log(data1.isBefore(data2)); // vero
Temporal utilizza un metodo di confronto statico per eseguire un confronto tra due oggetti dello stesso tipo. Restituisce -1 se la prima data viene prima della seconda, 0 se sono uguali o 1 se la prima data viene dopo la seconda. Nell'esempio seguente viene illustrato come confrontare due oggetti PlainDate. Entrambi gli argomenti di Temporal.PlainDate.compare devono essere oggetti PlainDate.
const date1 = Temporal.PlainDate.from({ anno: 2026, mese: 2, giorno: 24 }); const date2 = Temporal.PlainDate.from({ anno: 2026, mese: 3, giorno: 24 });
// data1 viene prima di data2, quindi -1 console.log(Temporal.PlainDate.compare(data1, data2));
// Errore se proviamo a confrontare due oggetti di tipo diverso console.log(Temporal.PlainDate.compare(date1, Temporal.Now.instant())); // TypeError: errore temporale: campi PlainDate forniti non validi.
In particolare, ciò semplifica l'ordinamento cronologico di una serie di oggetti temporali. // Un array di oggetti Temporal.PlainDate const date = [ ... ];
// usa Temporal.PlainDate.compare come funzione comparatrice date.sort(Temporal.PlainDate.compare);
Conversioni del fuso orario La libreria Moment principale non supporta le conversioni del fuso orario. Se hai bisogno di questa funzionalità, devi installare anche il pacchetto moment-timezone. Questo pacchetto non è scuotebile dagli alberi e pertanto può aumentare in modo significativo le dimensioni del pacchetto. Una volta installato moment-timezone, puoi convertire gli oggetti Moment in fusi orari diversi con il metodo tz. Come con altre operazioni Moment, questo muta il sottostanteoggetto. // Presupponendo l'ora della costa orientale degli Stati Uniti const adesso = momento(); console.log(ora); // Momento<2026-02-28T20:08:20-05:00>
// Converti nell'ora del Pacifico. // L'ora orientale originale è andata perduta. now.tz('America/Los_Angeles'); console.log(ora); // Momento<2026-02-28T17:08:20-08:00>
La funzionalità del fuso orario è incorporata nell'API Temporal quando si utilizza un oggetto Temporal.ZonedDateTime. Questi oggetti includono un metodo withTimeZone che restituisce un nuovo ZonedDateTime che rappresenta lo stesso momento nel tempo, ma nel fuso orario specificato. // Ancora una volta, presupponendo l'ora della costa orientale degli Stati Uniti const now = Temporal.Now.zonedDateTimeISO(); console.log(now.toLocaleString()); // 28/02/2026, 20:12:02 EST
// Converti nell'ora del Pacifico const nowPacific = now.withTimeZone('America/Los_Angeles'); console.log(nowPacific.toLocaleString()); // 28/02/2026, 17:12:02 PST
// L'oggetto originale rimane invariato console.log(now.toLocaleString()); // 28/02/2026, 20:12:02 EST
Nota: i valori formattati restituiti da toLocaleString dipendono, come suggerisce il nome, dalle impostazioni locali. Il codice di esempio è stato sviluppato nelle impostazioni locali en-US, quindi il formato è simile al seguente: 28/02/2026, 17:12:02 PST. In un'altra località, questo potrebbe essere diverso. Ad esempio, nella locale en-GB, otterresti qualcosa come 28/2/2026, 17:12:02 GMT-8. Un refactoring del mondo reale Supponiamo di creare un'app per pianificare eventi attraverso fusi orari. Parte di questa app è una funzione, getEventTimes, che accetta una stringa ISO 8601 che rappresenta l'ora e la data dell'evento, un fuso orario locale e un fuso orario target. La funzione crea stringhe di data e ora formattate per l'evento in entrambi i fusi orari. Se alla funzione viene fornita una stringa di input che non è una stringa di data/ora valida, genererà un errore. Ecco l'implementazione originale, utilizzando Moment (che richiede anche l'uso del pacchetto moment-timezone).
importa momento da 'moment-timezone';
funzione getEventTimes(inputString, userTimeZone, targetTimeZone) { const timeFormat = 'MMM G, AAAA, h:mm:ss a z';
// 1. Crea il momento iniziale nel fuso orario dell'utente const tempoevento = momento.tz( inputStringa, moment.ISO_8601, // Aspettatevi una stringa ISO 8601 true, // Analisi rigorosa utenteTimeZone );
// Genera un errore se inputString non rappresenta una data valida if (!eventTime.isValid()) { lancia un nuovo errore ('Inserimento data/ora non valido'); }
// 2. Calcola il tempo target // CRITICO: dobbiamo clonare, altrimenti 'eventTime' cambierà per sempre! const targetTime = eventTime.clone().tz(targetTimeZone);
ritorno { locale: eventTime.format(timeFormat), destinazione: targetTime.format(timeFormat), }; }
pianificazione const = getEventTimes( '2026-03-05T15:00-05:00', 'America/New_York', "Europa/Londra", );
console.log(schedule.local); // 5 marzo 2026, 15:00:00 EST
console.log(schedule.target); // 5 marzo 2026, 20:00:00 GMT
In questo esempio, stiamo utilizzando un formato di data previsto ISO 8601, che è utilmente integrato in Moment. Utilizziamo anche un'analisi rigorosa, il che significa che Moment non proverà a indovinare con una stringa di data che non corrisponde al formato. Se viene passata una stringa di data non ISO, si otterrà un oggetto data non valido e verrà generato un errore. L'implementazione temporale sembra simile, ma presenta alcune differenze fondamentali.
funzione getEventTimes(inputString, userTimeZone, targetTimeZone) { // 1. Analizza l'input direttamente in un istante, quindi crea // un ZonedDateTime nella zona dell'utente. const istante = Temporale.Istante.from(inputString); const eventTime = istante.toZonedDateTimeISO(userTimeZone);
// 2. Converti nella zona target // Ciò restituisce automaticamente un NUOVO oggetto; "eventTime" è sicuro. const targetTime = eventTime.withTimeZone(targetTimeZone);
// 3. Formatta utilizzando Intl (integrato) opzioni const = { anno: 'numerico', mese: 'breve', giorno: 'numerico', ora: 'numerico', minuto: '2 cifre', secondo: "2 cifre", timeZoneName: 'breve' };
ritorno { locale: eventTime.toLocaleString(navigator.lingua, opzioni), destinazione: targetTime.toLocaleString(navigator.lingua, opzioni) }; }
pianificazione const = getEventTimes( '2026-03-05T15:00-05:00', 'America/New_York', "Europa/Londra", );
console.log(schedule.local); // 5 marzo 2026, 15:00:00 EST
console.log(schedule.target); // 5 marzo 2026, 20:00:00 GMT
Con Moment, dobbiamo specificare esplicitamente una stringa di formato per le stringhe di data risultanti. Indipendentemente dalla posizione o dalle impostazioni internazionali dell'utente, gli orari degli eventi verranno sempre formattati come 5 marzo 2026, 3:00:00pm EST. Inoltre, non dobbiamo lanciare esplicitamente un’eccezione. Se una stringa non valida viene passata a Temporal.Instant.from, Temporal genererà l'eccezione per noi. Una cosa da notare è che anche con un'analisi rigorosa, la versione Moment è ancora più indulgente. Temporale richiede l'offset del fuso orario alla fine della stringa. Dovresti anche notare che, poiché stiamo utilizzando navigator.lingual, questo codice verrà eseguito solo in un ambiente browser, poiché navigator non è definito in un ambiente Node.js. L'implementazione temporale utilizza le impostazioni locali correnti del browser (navigator.lingual), quindi l'utente riceverà automaticamente gli orari degli eventi formattati nel formato dell'ora locale. Nella versione locale statunitense, questo è il 5 marzo 2026, 15:00:00 EST. Tuttavia, se l'utente si trova a Londra, ad esempio, gli orari dell'evento verranno formattati come 5 marzo 2026, 15:00:00 GMT-5. Sommario
Azione Momento.js Temporale Ora corrente momento() Temporal.Now.zonedDateTimeISO() Analisi ISO momento(str) Temporale.Instant.from(str) Aggiungi tempo .add(7, 'giorni') (muta) .add({ giorni: 7 }) (nuovo oggetto) Differenza .diff(altro, 'ore') .da(altre).ore Fuso orario .tz('Zona/Nome') .withTimeZone('Zona/Nome')
A prima vista, la differenza potrebbe essere leggermente diversa nella sintassi (e nel caso di Temporal, a volte più dettagliata e più rigorosa), ma ci sono diversi vantaggi chiave nell'usare Temporal rispetto a Moment.js:
Essere più espliciti significa meno sorprese e bug non intenzionali. Moment può sembrare più indulgente, ma comporta “congetture”, che a volte possono portare a date errate. Se dai a Temporal qualcosa di non valido, viene generato un errore. Se il codice viene eseguito, sai di avere una data valida. Moment può aggiungere dimensioni significative al pacchetto dell'applicazione, in particolare se stai utilizzando il pacchetto moment-timezone. Temporal non aggiunge nulla (una volta distribuito nei browser di destinazione). L'immutabilità ti dà la certezza che non perderai o sovrascriverai mai i dati durante l'esecuzione di conversioni e operazioni di data. Diverse rappresentazioni del tempo (Instant, PlainDateTime, ZonedDateTime) a seconda delle esigenze, dove Moment è sempre un wrapper attorno a un timestamp UTC. Temporal utilizza le API Intl per la formattazione della data, il che significa che puoi avere una formattazione compatibile con le impostazioni locali senza dover specificare esplicitamente i token.
Note sul polyfill Come accennato in precedenza, è disponibile un polyfill temporale, distribuito come pacchetto npm denominato @js-temporal/polyfill. Se desideri utilizzare Temporal oggi, avrai bisogno di questo polyfill per supportare browser come Safari che non hanno ancora fornito l'API. La cattiva notizia è che aumenterà la dimensione del pacchetto. La buona notizia è che aggiunge comunque molto meno di momento o momento-fuso orario. Ecco un confronto delle dimensioni dei pacchetti riportati da Bundlephobia.com, un sito Web che presenta informazioni sulle dimensioni dei pacchetti npm (fare clic sul nome di ciascun pacchetto per vedere l'analisi Bundlephobia):
Pacchetto Minimizzato Minimizzato e compresso @js-temporale/polyfill 154,1KB 44,1KB momento 294,4kB 75,4KB momento-fuso orario 1 MB 114,2KB
Anche il polyfill ha storicamente avuto alcuni problemi di prestazioni relativi all'utilizzo della memoria e, al momento della stesura di questo articolo, è considerato in uno stato alfa. Per questo motivo, potresti non volerlo utilizzare in produzione finché non raggiunge uno stato più maturo. L’altra buona notizia è che si spera che il polyfill non sia necessario ancora per molto (a meno che non sia necessario supportare i browser più vecchi, ovviamente). Al momento in cui scrivo, Temporal è stato fornito in Chrome, Edge e Firefox. Non è ancora del tutto pronto in Safari, anche se sembra essere disponibile con un flag di runtime nell'ultima Technology Preview.
