So erhalten Sie das aktuelle Datum in JavaScript: Eine Analyse einer häufig gestellten Frage auf Stack Overflow
Wenn Sie gerade erst mit der Webentwicklung beginnen, werden Sie früher oder später vor der Aufgabe stehen: das aktuelle Datum auf einer Seite anzuzeigen. Das klingt einfach, oder? Aber wie die Statistik von Stack Overflow zeigt, erhält die Frage "How do I get the current date in JavaScript?" jeden Monat tausende Aufrufe. Warum? Weil hinter dieser einfachen Formulierung eine ganze Reihe von Nuancen steckt: von Ausgabeformaten bis hin zur Arbeit mit Zeitzonen.
In diesem Artikel geben wir nicht nur fertigen Code. Wir analysieren ihn bis ins kleinste Detail, lernen, Formate zu steuern und vermeiden typische Fallstricke, auf die Anfänger hereinfallen. Los geht's!
Lernen Sie kennen: das Date-Objekt – Ihr wichtigstes Werkzeug
In JavaScript gibt es keinen speziellen Befehl "zeige heute". Stattdessen bietet die Sprache ein mächtiges, aber manchmal tückisches Objekt Date. Um den aktuellen Zeitpunkt zu erhalten, reicht es, eine neue Instanz ohne Argumente zu erstellen:
const now = new Date();console.log(now); // Ausgabe: Tue Oct 15 2024 14:30:00 GMT+0300So einfach ist das! Aber schauen wir uns an, was wir eigentlich erhalten haben. In der Konsole sehen Sie etwas wie Tue Oct 15 2024 14:30:00 GMT+0300. Dies ist ein für Menschen lesbares Format, aber es ist nicht immer für reale Aufgaben geeignet. Stellen Sie sich vor, Sie erstellen einen Online-Shop und möchten das Bestelldatum als "15.10.2024" anzeigen – diese "native" Ausgabe ist ungeeignet.
Die Sache ist die, dass das Date-Objekt die Millisekunden speichert, die seit dem 1. Januar 1970 (Unix-Epoche) vergangen sind. Was wir in der Konsole sehen, ist das Ergebnis einer impliziten Umwandlung in einen String. Um die Kontrolle über das Format zu erlangen, müssen wir die Methoden des Objekts verwenden.
Methoden zum Extrahieren von Datumskomponenten
Stellen Sie sich das Datum wie eine Pizza vor, die in Stücke geschnitten werden muss: Jahr, Monat, Tag, Stunden, Minuten, Sekunden. Das Date-Objekt hat spezielle "Messer" – Methoden für jedes Stück.
Hier sind die gängigsten:
getFullYear()– gibt das Jahr zurück (z. B. 2024).getMonth()– gibt den Monat von 0 bis 11 zurück. Achtung: Januar ist 0, Dezember ist 11. Das ist eine häufige Falle!getDate()– gibt den Tag des Monats zurück (1-31).getDay()– gibt den Wochentag von 0 (Sonntag) bis 6 (Samstag) zurück.getHours(),getMinutes(),getSeconds()– offensichtlich Stunden, Minuten, Sekunden.
Lassen Sie uns daraus unser eigenes Datum zusammensetzen:
const now = new Date();const year = now.getFullYear();const month = now.getMonth() + 1; // +1, weil Januar = 0const day = now.getDate();const hours = now.getHours();const minutes = now.getMinutes();
console.log(`${day}.${month}.${year} ${hours}:${minutes}`);// Ausgabe: "15.10.2024 14:30"Beachten Sie: Wir haben +1 zum Monat addiert. Dies ist ein klassischer Anfängerfehler – die Null-basierte Nummerierung zu vergessen. Merken Sie sich ein für alle Mal: getMonth() gibt 0 für Januar zurück.
Schöne Ausgabe: Datumsformatierung
Das manuelle Zusammenbauen eines Strings ist gut zum Verständnis, aber es gibt elegantere Wege. JavaScript bietet mehrere eingebaute Methoden zur Formatierung:
1. toLocaleDateString() – für lokalisierte Ausgabe
Diese Methode passt sich an die regionalen Einstellungen an. Möchten Sie es auf Deutsch? Bitte sehr:
const now = new Date();console.log(now.toLocaleDateString('ru-RU')); // "15.10.2024"console.log(now.toLocaleDateString('en-US')); // "10/15/2024"console.log(now.toLocaleDateString('de-DE')); // "15.10.2024"Sie können das Format sogar an Ihre Bedürfnisse anpassen, indem Sie ein Objekt mit Optionen übergeben:
const options = { year: 'numeric', month: 'long', day: 'numeric', weekday: 'long'};console.log(now.toLocaleDate