JavaScript Datum
Arbeiten mit dem Date-Objekt date() in JavaScript - Grundlagen
Oft muss in Programmen mit einem Datum bzw. mit Zeiten gearbeitet werden. Dazu bietet JavaScript das Datums-Objekt (Date-Object) mit vielen, mächtigen Funktionen. Bei der Arbeit mit dem Date-Objekt müssen einige Besonderheiten beachtet werden. So ist der Ausdruck "23.11.2022" nicht automatisch ein Datum, sondern ein Text. Um diesen 'String' "23.11.2022" in einer Datumsfunktion zu verwenden, muss er in ein Datums-Objekt umgewandelt werden.
Rubrik Datum
- Datumsinformationen werden im Objekt Date() bereitgehalten
- Grundsätzlich handelt es sich dabei um einen Counter
- Start des Zählvorgangs ist der 01.01.1970, 0:00:00 Uhr UTC (Deutschland = Universal Time + 1 Stunde)
- Gezählt wird also in Millisekunden seit dem Startdatum 01.01.1970
Das Objekt Date() 'gehört' dem System! Deshalb lassen wir auch die Finger davon und versuchen es nicht zu beeinflussen / zu ändern. Auslesen ist OK. Will man auf ein Datumsobjekt Einfluss nehmen, muss man schon eine eigene Kopie herstellen. Diese Kopie gehört uns! Damit dürfen wir arbeiten.
const Datum = new Date();
Der Datums-Zeit-Wert ist also ein Wert in Millisekunden, gezählt seit dem 1. Januar 1970. Bis zum Laden dieser Seite sind seitdem genau xxx Millisekunden vergangen. Jeder Datums- und Zeitwert wird auf dieser Basis kalkuliert.
Die Berechnung einer Zeitspanne als Beispiel:
Abstand vom 01. Januar 2022 bis jetzt
01.01.1970 bis jetzt | 01.01.1970 bis 01.01.2022 | Differenz |
| | |
Nun kennt man den zeitlichen Abstand zwischen diesen beiden Zeitstempeln in Millisekunden. Wenn man das Ergebnis (xxx) in Tage umrechnen möchte, dividiert man diesen Wert durch 86 400 000.
Dieser Umrechnungsfaktor entspricht den Millisekunden pro Tag.
Das Ergebnis ist xxx Tage. Gerundet sind das etwa xxx Tage.
So muss man auch beim Einsatz von JavaScript verfahren! Möchte man den Abstand in Tagen zwischen zwei Zeitstempeln errechnen, ermittelt man zunächst die beiden Datumswerte und lässt durch JavaScript die Differenz berechnen. Das Ergebnis in Millisekunden kann dann noch in Tage (86 400 000 ms/Tag) gewandelt und zur Anzeige hübsch formatiert werden.
Aus dem Date-Objekt kann man Datums- und Zeit-Informationen ermitteln. Dazu stehen in JavaScript unter anderem folgende Methoden zur Verfügung:
Für Web-Worker und Scriptschreiber: Mit JavaScript haben Sie Einfluss auf das im Browserfenster angezeigte HTML-Dokument und die Möglichkeit, auf Benutzeraktionen zu reagieren. Inhalte können abgefragt und die Darstellung der Seite kann verändert werden. Einige der in diesem Beispiel verwendeten Techniken zeige ich unten auf. Im Quelltext der Seite können sie den gesamten Zusammenhang erkennen.
Methoden
Datums- und Zeit-Informationen ermitteln
// Jahreswert vierstellig extrahieren
const Datum = new Date();
let year = Datum.getFullYear();
// Monatswert extrahieren [0 - 11]
const Datum = new Date();
let month = Datum.getMonth() + 1;
// Tageswert extrahieren
const Datum = new Date();
let day = Datum.getDate();
// Stundenwert extrahieren
const Datum = new Date();
let hour = Datum.getHours();
// Minutenwert extrahieren
const Datum = new Date();
let minutes = Datum.getMinutes();
// Sekundenwert extrahieren
const Datum = new Date();
let seconds = Datum.getSeconds();
Auf weiteren Seiten in der Rubrik Datum möchte ich demnächst an Beispielen erklären, wie häufig eingesetzte Rechenoperationen mit dem Date()-Objekt in JavaScript gelöst werden. Interessant sind auch die Erweiterungen in JavaScript. Seit einigen Jahren stehen neue Möglichkeiten zum Extrahieren von Informationen und zur Darstellung von Datumsformaten zur Verfügung, die den internationalen, aber für uns wichtig, der deutschen Schreibweise des Datums entsprechen.
Beispiel: Deutsches Datumsformat mit Wochentag, Monatsnamen und 4-stelligem Jahr
xxx
// lokales Datumsformat DE
const Datum = new Date();
let DatumDeutsch = Datum.toLocaleString('de-DE', Optionen );
// eingetragene Optionen:
// weekday: 'long', year: 'numeric', month: 'long', day: 'numeric'
Beispiel: US-Datumsformat mit Darstellung der Uhrzeit
xxx
// lokales Datumsformat US
const Datum = new Date();
let DatumDeutsch = Datum.toLocaleString('en-US', Optionen );
// eingetragene Option:
// hour12: 'false'
Keywords
Datum
Date()
Berechnung
getMinutes()
getSeconds()
Wochentag
Date()-Objekt
Zeit
Datumswert
UTC
Clock
zeitverzögert
setTimeout()
CSS-Klassen
JavaScript
getFullYear()
getMonth()
getDate()
getHours()
toLocaleString