Datums- und Zeitverwaltung mit der Temporal API

Hast du die Schnauze voll vom Date-Objekt in JavaScript? Ich auch! Zum Glück wird sie bald von der Temporal-API abgelöst. Diese umfasst mehrere Klassen für die Datums- und Zeitverwaltung, einschließlich integrierter Zeitzonen- und Kalenderdarstellung.

Eine Frau stützt ihre Arme auf einen Tisch und schaut auf den großen Wecker neben sich. Foto: © KoolShooters / pexels.com

Die neue API ist bereits in Firefox Nightly verfügbar. Wir sehen uns kurz die wichtigsten Funktionen von Temporal an. Danach zeige ich euch einige von mir zusammengestellte Code-Beispiele.

Grober Überblick

Die Temporal-API stellt über 200 Utility-Methoden über mehrere Klassen zur Verfügung. Das ist eine ganze Menge! Ich werde daher nicht auf alle eingehen, sondern nur die wichtigsten Funktionen nennen.

Es gibt mehrere Objekte für die Arbeit mit einfachen Datums- und Zeitangaben, ohne Zeitzone:

  • Temporal.PlainDate stellt ein Kalenderdatum ohne Zeit oder Zeitzone dar. Beispiel: 2025-04-14
  • Temporal.PlainTime stellt eine Zeit ohne Datum oder Zeitzone dar. Beispiel: 21:10:30.025
  • Temporal.PlainDateTime steht für ein Datum und eine Uhrzeit ohne Zeitzone. Beispiel: 2025-04-14T21:10:30.025

Zur Darstellung eines eindeutigen Zeitpunkts verwenden wir das Objekt Temporal.Instant. Es ist semantisch identisch zu Date, aber präziser (im Nanosekundenbereich).

Schließlich kommen wir zum Objekt Temporal.ZonedDateTime, das einen Zeitpunkt, eine Zeitzone und ein Kalendersystem kombiniert. Beispiel: 2025-04-16T21:22:26.384+02:00[Europe/Vienna].

Außerdem können wir mit dem Objekt Temporal.Now die aktuelle Zeit in verschiedenen Formaten abrufen. Und Temporal.Duration stellt eine Differenz zwischen zwei Zeitpunkten dar, die wir auch in Datum/Zeit-Berechnungen verwenden können.

Code-Beispiele

Ich habe eine Liste von Code-Beispielen für die Arbeit mit der neuen Temporal API in JavaScript zusammengestellt. Hier sind ein paar davon:

Ein einfaches Datumsobjekt erstellen und auf Teile davon zugreifen

let calendarDate = Temporal.PlainDate.from("2025-04-09"); calendarDate.day; // 9 calendarDate.dayOfWeek; // 3 calendarDate.month; // 4 calendarDate.year; // 2025

Hinzufügen einer Dauer zu einem unveränderlichen einfachen Zeitobjekt

let t1 = new Temporal.PlainTime(14, 55, 10, 250); // "14:55:10.25" let t2 = t1.add({ seconds: 5000 }); t2.toString(); // "16:18:30.25"

Sprachabhängige Formatierung eines Datum/Zeit-Objekts mit Zeitzone

let datetime = Temporal.ZonedDateTime.from("2020-10-15T08:30Z[America/New_York]"); datetime.toLocaleString("en-US"); // "10/15/2020, 4:30:00 AM EDT"

Zwei Zeitpunkte vergleichen

let inst1 = Temporal.Instant.from("2022-07-10T12:00Z"); let inst2 = Temporal.Instant.from("2023-01-01T15+01:00"); inst1.equals(inst2); // false Temporal.Instant.compare(inst1, inst2); // -1 (is before)

Runden einer Dauer auf eine bestimmte Einheit

let duration = Temporal.PlainTime.from("12:30").until("17:45"); // "PT5H15M" duration = duration.round("hours"); // "PT5H"

Browser-Unterstützung

Na, schon begeistert? Ich auf jeden Fall! Und es wird noch besser: Firefox wird bald der erste Browser sein, der Temporal in einer stabilen Version ausliefert. Firefox 139 soll am 27. Mai erscheinen.

Die Implementierung in anderen Browsern ist noch in Arbeit (Chromium, WebKit/Safari). Aber ich bin sicher, dass es nicht mehr lange dauert. In der Zwischenzeit: Macht euch mit Temporal in Firefox Nightly vertraut. 😉

Erstellt am