Datum in JavaScript ohne Bibliothek formatieren: ein Live-Builder für Intl.DateTimeFormat, Code für YYYY-MM-DD und MM/DD/YYYY, Zeitzonen, relative Zeit, Zeiträume und die Parsing-Fallen hinter Fehlern um einen Tag.
Um ein Datum in JavaScript zu formatieren, nutzt du Intl.DateTimeFormat oder toLocaleDateString mit einem Locale und Optionen, zum Beispiel date.toLocaleDateString("en-US", { dateStyle: "long" }) für March 5, 2026. Verwende toISOString() für APIs, die Option timeZone, um eine andere Zone anzuzeigen, und Intl.RelativeTimeFormat für Formulierungen wie vor 3 Tagen.
Schnelle Antworten
Wähle im Builder ein Locale und Optionen und kopiere den erzeugten Code; die Vorschau wird von deinem eigenen Browser formatiert. Darunter findest du eine Tabelle mit gängigen Formaten und ausführbare Beispiele für Zeitzonen, relative Zeit und Zeiträume.
Nimm das lokale Jahr, den Monat plus eins und den Tag, fülle sie mit padStart(2, "0") auf und verbinde sie mit Bindestrichen. toISOString().slice(0, 10) liefert dieselbe Form, aber in UTC, und kann daher um Mitternacht herum den falschen Tag anzeigen.
new Date("2026-03-05") wird als Mitternacht UTC gelesen. Westlich von Greenwich ist es zu diesem Zeitpunkt lokal noch der 4. Parse mit Uhrzeit ("2026-03-05T00:00") oder mit new Date(2026, 2, 5), um lokale Mitternacht zu erhalten.
Zum Formatieren nicht. Intl deckt Locales, Zeitzonen und relative Zeit in jedem modernen Browser ab. Die Maintainer von Moment bezeichnen es selbst als Legacy-Projekt; für Datumsberechnungen eignet sich eine kleine Bibliothek wie date-fns oder die neuere Temporal API (sofern verfügbar) gut.
Übergib timeZone mit einem IANA-Namen, zum Beispiel { timeZone: "America/New_York", timeStyle: "short" }. Das Date-Objekt bleibt derselbe Zeitpunkt; nur die Schreibweise ändert sich.
Gängige Formate und der jeweilige Code
Ein ISO-String nur mit Datum wird als Mitternacht UTC gelesen, ein Datum-Uhrzeit-String ohne Offset dagegen als Ortszeit. Dieser Unterschied verursacht die meisten Fehler um einen Tag.
Setze es mit padStart aus den lokalen Teilen zusammen. Der Trick mit dem Locale en-CA liefert dasselbe Ergebnis, verlässt sich aber darauf, dass das Format dieses Locales gleich bleibt.
timeZone erwartet einen IANA-Namen. Das Date selbst hat keine Zone; nur die Formatierung ändert sich. Beachte, dass timeZoneName nicht mit dateStyle oder timeStyle kombiniert werden kann.
Intl.RelativeTimeFormat schreibt die Wörter; die Einheit wählst du. Diese Hilfsfunktion nimmt die größte passende Einheit.
formatRange entfernt doppelte Teile, sodass eine Buchung vom 5. bis zum 9. desselben Monats natürlich klingt.
Wenn kein vordefinierter Stil passt, nimm die lokalisierten Teile und ordne sie selbst an, zum Beispiel um den Tag größer darzustellen als den Monat.
Arbeitest du mit Epoch-Sekunden? Nutze den
Im Builder verwendete Intl.DateTimeFormat-Optionen
(keine)
(deine Zone)
Fehler: {msg}
Datum und Uhrzeit
Locale
Zeitzone
Modus
Vordefinierte Stile
Jeden Teil wählen
Code kopieren
Kostenlos starten · Keine Kreditkarte nötig