Datumsdifferenz in Sekunden

Einführung

In diesem Lab werden wir untersuchen, wie man mit JavaScript die Differenz zwischen zwei Daten in Sekunden berechnet. Das Verständnis, wie man mit Daten und Zeiten umgeht, ist für viele Webanwendungen unerlässlich. Wir werden eine Funktion erstellen, die zwei Date-Objekte als Eingabe nimmt und die Zeitdifferenz zwischen ihnen in Sekunden zurückgibt. Diese Technik ist für verschiedene Anwendungen nützlich, einschließlich der Messung von Zeitintervallen, der Berechnung von Dauerzeiten oder der Erstellung von Zeitgebern. Am Ende dieses Labs werden Sie ein besseres Verständnis von JavaScript-Date-Objekten haben und wissen, wie Sie Zeitberechnungen effizient durchführen können.

Erste Schritte mit JavaScript-Date-Objekten

JavaScript bietet ein eingebautes Date-Objekt, das es uns ermöglicht, mit Daten und Zeiten zu arbeiten. Bevor wir die Differenz zwischen Daten berechnen, lernen wir zunächst, wie man Date-Objekte in JavaScript erstellt und damit arbeitet.

Starten der Node.js-Umgebung

Beginnen wir damit, die interaktive Node.js-Umgebung zu öffnen:

1. Öffnen Sie das Terminal, indem Sie auf das Terminal-Menü oben im WebIDE klicken.
2. Geben Sie den folgenden Befehl ein und drücken Sie die Eingabetaste:

node

Sie sollten jetzt die Node.js-Eingabeaufforderung (>) sehen, was darauf hinweist, dass Sie sich in der interaktiven JavaScript-Umgebung befinden. Dadurch können Sie JavaScript-Code direkt im Terminal ausführen.

Erstellen von Date-Objekten

In JavaScript können wir ein neues Date-Objekt auf verschiedene Arten erstellen:

// Aktuelles Datum und Uhrzeit
let now = new Date();
console.log(now);

// Bestimmtes Datum und Uhrzeit (Jahr, Monat [0-11], Tag, Stunde, Minute, Sekunde)
let specificDate = new Date(2023, 0, 15, 10, 30, 45); // 15. Januar 2023, 10:30:45
console.log(specificDate);

// Datum aus einem String
let dateFromString = new Date("2023-01-15T10:30:45");
console.log(dateFromString);

Versuchen Sie, jedes dieser Beispiele in der Node.js-Umgebung einzugeben und beobachten Sie die Ausgabe.

Beachten Sie, dass in JavaScript die Monate nullbasiert indiziert sind, d. h. Januar ist 0, Februar ist 1 und so weiter.

Abrufen des Zeitstempels aus Date-Objekten

Jedes Date-Objekt in JavaScript speichert intern die Zeit als Anzahl der Millisekunden, die seit dem 1. Januar 1970 (UTC) vergangen sind. Dies wird als Zeitstempel (timestamp) bezeichnet.

let now = new Date();
console.log(now.getTime()); // Zeitstempel in Millisekunden abrufen

Dieser Zeitstempel wird für die Berechnung der Differenz zwischen Daten nützlich sein.

Verständnis von Datumsberechnungen in JavaScript

Nachdem wir nun wissen, wie man Date-Objekte erstellt, lernen wir, wie man die Differenz zwischen zwei Daten berechnet.

Datumsarithmetik in JavaScript

JavaScript ermöglicht es Ihnen, arithmetische Operationen direkt auf Date-Objekten auszuführen. Wenn Sie ein Date-Objekt von einem anderen subtrahieren, wandelt JavaScript diese automatisch in Zeitstempel (Millisekunden) um und führt die Subtraktion durch.

let date1 = new Date("2023-01-01T00:00:00");
let date2 = new Date("2023-01-01T00:01:00");

let differenceInMilliseconds = date2 - date1;
console.log(differenceInMilliseconds); // 60000 (60 Sekunden * 1000 Millisekunden)

Versuchen Sie, diesen Code in Ihrer Node.js-Umgebung auszuführen. Das Ergebnis sollte 60000 sein, was 60 Sekunden in Millisekunden darstellt.

Umrechnen von Millisekunden in Sekunden

Um eine Zeitdifferenz von Millisekunden in Sekunden umzurechnen, teilen wir einfach durch 1000:

let differenceInSeconds = differenceInMilliseconds / 1000;
console.log(differenceInSeconds); // 60

Dadurch erhalten wir unsere Zeitdifferenz in Sekunden, was in diesem Beispiel 60 Sekunden oder 1 Minute ist.

Erstellen einer Funktion zur Berechnung der Datumsdifferenz

Nachdem wir das Konzept verstanden haben, erstellen wir eine einfache Funktion, um die Differenz zwischen zwei Daten in Sekunden zu berechnen:

function getDateDifferenceInSeconds(startDate, endDate) {
  return (endDate - startDate) / 1000;
}

// Testen Sie die Funktion
let start = new Date("2023-01-01T00:00:00");
let end = new Date("2023-01-01T00:01:30");
let difference = getDateDifferenceInSeconds(start, end);
console.log(difference); // 90 (1 Minute und 30 Sekunden)

Versuchen Sie, diese Funktion in der Node.js-Umgebung einzugeben und auszuführen. Das Ergebnis sollte 90 sein, was 1 Minute und 30 Sekunden darstellt.

Implementierung der Funktion zur Berechnung der Datumsdifferenz mit Pfeilfunktionen (Arrow Functions)

Nachdem wir nun wissen, wie man Datumsdifferenzen berechnet, implementieren wir eine kompaktere Version unserer Funktion mit Pfeilfunktionen (Arrow Functions).

Pfeilfunktionen in JavaScript

Pfeilfunktionen bieten eine kürzere Syntax für das Schreiben von Funktionen in JavaScript. So können wir unsere Funktion zur Berechnung der Datumsdifferenz mit der Syntax von Pfeilfunktionen umschreiben:

const getSecondsDiffBetweenDates = (dateInitial, dateFinal) =>
  (dateFinal - dateInitial) / 1000;

Diese Funktion macht genau dasselbe wie unsere vorherige Funktion, aber mit einer saubereren und kompakteren Syntax.

Erstellen einer JavaScript-Datei

Erstellen wir eine JavaScript-Datei, um unsere Funktion zu speichern und zu testen. Verlassen Sie die Node.js-Umgebung, indem Sie Strg+D drücken oder .exit eingeben und die Eingabetaste drücken.

Jetzt erstellen Sie eine neue Datei mit dem Namen dateDifference.js im WebIDE:

1. Klicken Sie auf das Symbol "Explorer" in der linken Seitenleiste.
2. Klicken Sie mit der rechten Maustaste im Dateiexplorer und wählen Sie "Neue Datei" aus.
3. Benennen Sie die Datei dateDifference.js und drücken Sie die Eingabetaste.
4. Fügen Sie den folgenden Code in die Datei ein:

// Funktion zur Berechnung der Differenz zwischen zwei Daten in Sekunden
const getSecondsDiffBetweenDates = (dateInitial, dateFinal) =>
  (dateFinal - dateInitial) / 1000;

// Testbeispiele
console.log("Beispiel 1:");
console.log(
  getSecondsDiffBetweenDates(
    new Date("2020-12-24 00:00:15"),
    new Date("2020-12-24 00:00:17")
  )
); // Erwartete Ausgabe: 2

console.log("\nBeispiel 2:");
console.log(
  getSecondsDiffBetweenDates(
    new Date("2020-12-24 00:00:00"),
    new Date("2020-12-24 00:01:00")
  )
); // Erwartete Ausgabe: 60

console.log("\nBeispiel 3:");
console.log(
  getSecondsDiffBetweenDates(
    new Date("2020-12-24 00:00:00"),
    new Date("2020-12-24 01:00:00")
  )
); // Erwartete Ausgabe: 3600

Speichern Sie die Datei, indem Sie Strg+S drücken oder auf Datei > Speichern klicken.

Ausführen der JavaScript-Datei

Um die Datei, die wir gerade erstellt haben, auszuführen, verwenden Sie den folgenden Befehl im Terminal:

node dateDifference.js

Sie sollten die folgende Ausgabe sehen:

Beispiel 1:
2

Beispiel 2:
60

Beispiel 3:
3600

Dies bestätigt, dass unsere Funktion korrekt funktioniert:

• Erstes Beispiel: Die Differenz zwischen 00:00:15 und 00:00:17 beträgt 2 Sekunden.
• Zweites Beispiel: Die Differenz zwischen 00:00:00 und 00:01:00 beträgt 60 Sekunden (1 Minute).
• Drittes Beispiel: Die Differenz zwischen 00:00:00 und 01:00:00 beträgt 3600 Sekunden (1 Stunde).

Erstellen einer praktischen Anwendung

Nachdem wir nun eine funktionierende Funktion haben, um die Differenz zwischen Daten in Sekunden zu berechnen, erstellen wir eine praktischere Anwendung. Wir werden einen einfachen Timer erstellen, der berechnet, wie viel Zeit seit dem Start vergangen ist.

Erstellen einer Timer-Anwendung

Erstellen Sie eine neue Datei mit dem Namen timer.js im WebIDE:

1. Klicken Sie auf das Symbol "Explorer" in der linken Seitenleiste.
2. Klicken Sie mit der rechten Maustaste im Dateiexplorer und wählen Sie "Neue Datei" aus.
3. Benennen Sie die Datei timer.js und drücken Sie die Eingabetaste.
4. Fügen Sie den folgenden Code in die Datei ein:

// Funktion zur Berechnung der Differenz zwischen zwei Daten in Sekunden
const getSecondsDiffBetweenDates = (dateInitial, dateFinal) =>
  (dateFinal - dateInitial) / 1000;

// Startzeit - wenn das Skript beginnt, auszuführen
const startTime = new Date();
console.log(`Timer gestartet um: ${startTime.toLocaleTimeString()}`);

// Funktion zum Aktualisieren und Anzeigen der verstrichenen Zeit
function updateTimer() {
  const currentTime = new Date();
  const elapsedSeconds = getSecondsDiffBetweenDates(startTime, currentTime);

  // Formatieren der Zeit als Stunden:Minuten:Sekunden
  const hours = Math.floor(elapsedSeconds / 3600);
  const minutes = Math.floor((elapsedSeconds % 3600) / 60);
  const seconds = Math.floor(elapsedSeconds % 60);

  const formattedTime = `${hours.toString().padStart(2, "0")}:${minutes
    .toString()
    .padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`;

  // Leeren der Konsole und Anzeigen der aktualisierten Zeit
  console.clear();
  console.log(`Timer gestartet um: ${startTime.toLocaleTimeString()}`);
  console.log(`Verstrichene Zeit: ${formattedTime}`);
}

// Aktualisieren des Timers alle Sekunden
console.log("Timer läuft... Drücken Sie Strg+C, um ihn zu stoppen.");
const timerInterval = setInterval(updateTimer, 1000);

// Halten des Skripts am Laufen
setTimeout(() => {
  clearInterval(timerInterval);
  console.log("\nTimer gestoppt nach 1 Minute.");
}, 60000); // Laufzeit: 1 Minute

Speichern Sie die Datei, indem Sie Strg+S drücken oder auf Datei > Speichern klicken.

Ausführen der Timer-Anwendung

Um die Timer-Anwendung auszuführen, verwenden Sie den folgenden Befehl im Terminal:

node timer.js

Der Timer startet und wird jede Sekunde aktualisiert, um anzuzeigen, wie viel Zeit seit dem Start vergangen ist. Der Timer stoppt automatisch nach 1 Minute, oder Sie können ihn früher stoppen, indem Sie Strg+C drücken.

Verständnis der Timer-Anwendung

Lassen Sie uns analysieren, wie die Timer-Anwendung funktioniert:

1. Wir definieren die getSecondsDiffBetweenDates-Funktion, um die Zeitdifferenz in Sekunden zu berechnen.
2. Wir erfassen die Startzeit, wenn das Skript beginnt, auszuführen.
3. Wir definieren eine updateTimer-Funktion, die:
   • Die aktuelle Zeit ermittelt
   • Berechnet, wie viele Sekunden seit der Startzeit vergangen sind
   • Die verstrichene Zeit im Format Stunden:Minuten:Sekunden formatiert
   • Die formatierte Zeit anzeigt
4. Wir verwenden setInterval, um die updateTimer-Funktion alle 1000 Millisekunden (1 Sekunde) auszuführen.
5. Wir verwenden setTimeout, um den Timer nach 60000 Millisekunden (1 Minute) zu stoppen.

Diese Anwendung zeigt eine praktische Verwendung unserer Funktion zur Berechnung der Datumsdifferenz für die Erstellung eines Echtzeit-Timers.

Zusammenfassung

In diesem Lab haben Sie gelernt, wie man mit Daten in JavaScript arbeitet und wie man die Differenz zwischen zwei Daten in Sekunden berechnet. Hier ist eine Zusammenfassung dessen, was Sie erreicht haben:

1. Sie haben gelernt, wie man JavaScript-Date-Objekte erstellt und manipuliert.
2. Sie verstehen, wie JavaScript intern Datumsarithmetik mit Zeitstempeln (timestamps) durchführt.
3. Sie haben eine Funktion implementiert, um die Differenz zwischen zwei Daten in Sekunden zu berechnen.
4. Sie haben eine praktische Timer-Anwendung erstellt, die die Funktion zur Berechnung der Datumsdifferenz nutzt.

Diese Fähigkeiten werden für viele reale Anwendungen von Wert sein, wie beispielsweise:

• Countdown-Timer für Veranstaltungen
• Messen der Leistung oder der Ladezeiten in Webanwendungen
• Berechnen der Zeiträume zwischen Benutzeraktionen
• Implementieren von Zeitfunktionen in Webanwendungen

JavaScripts Date-Objekt ist ein leistungsstarkes Werkzeug für die Arbeit mit Daten und Zeiten, und das Wissen, wie man Zeitdifferenzen berechnet, ist eine wichtige Fähigkeit für Webentwickler.