Das Arbeiten mit Daten ist keine leichte Aufgabe. Aber das Paket date-fns macht es einfach, mit den Daten in JavaScript zu arbeiten.
Lassen Sie uns tief in das Paket eintauchen date-fns um unser Leben leichter zu machen als zuvor. Das Paket date-fns ist leicht.
Installieren Sie das Paket
Wir müssen das Projekt mit der npm einrichten, um mit einem Paket eines Drittanbieters arbeiten zu können. Lassen Sie uns schnell die Schritte sehen, um unser Setup abzuschließen.
Ich nehme an, Sie haben NodeJS installiert or IDE dies zu üben.
- Navigieren Sie zu dem gewünschten Verzeichnis, in dem Sie arbeiten möchten.
- Führen Sie den Befehl aus
npm initum das Projekt zu initialisieren. - Beantworten Sie alle Fragen nach Ihren Wünschen.
- Installieren Sie jetzt die
date-fnsmit dem folgenden Befehl
npm install date-fns- Erstellen Sie eine Datei mit dem Namen
dateFunctions.js
Jetzt sind wir bereit, in das Paket zu springen date-fns. Lassen Sie uns einige wesentliche Methoden aus dem Paket lernen.
isValid
Alle Daten sind nicht gültig.
Zum Beispiel gibt es kein Datum wie 2021-02-30. Wie können wir überprüfen, ob das Datum gültig ist oder nicht?
Das Verfahren isValid von dem date-fns Das Paket hilft uns herauszufinden, ob das angegebene Datum gültig ist oder nicht.
Überprüfen Sie, ob der folgende Code mit der Gültigkeit der Daten einwandfrei funktioniert oder nicht.
const { isValid } = require("date-fns");
console.log(isValid(new Date("2021, 02, 30")));
Wenn Sie den obigen Code ausführen, werden Sie finden 30th February 2021 ist gültig. Oh! Es ist nicht.
Warum passiert das?
JavaScript konvertiert den zusätzlichen Tag im Februar in 1st March 2021 Das ist ein gültiges Datum. Um dies zu bestätigen, drucken Sie new Date("2021, 02, 30") zur Konsole.
console.log(new Date("2021, 02, 30"));
Das Paket date-fns bietet eine Methode namens parse um dieses Problem zu umgehen. Die Methode parse analysiert das von Ihnen angegebene Datum und gibt genaue Ergebnisse zurück.
Schauen Sie sich den folgenden Code an.
const { isValid, parse } = require("date-fns");
const invalidDate = parse("30.02.2021", "dd.MM.yyyy", new Date());
const validDate = parse("25.03.2021", "dd.MM.yyyy", new Date());
console.log(isValid(invalidDate));
console.log(isValid(validDate));
format
Eine der grundlegenden Anwendungen bei der Arbeit mit Datumsangaben besteht darin, sie so zu formatieren, wie wir es möchten. Wir formatieren die Daten in verschiedenen Formaten mit dem format Methode aus dem date-fns Paket.
Formatieren Sie das Datum als 23-01-1993, 1993-01-23 10:43:55, Tuesday, January 23rd 1993, etc .., Führen Sie den folgenden Code aus, um das entsprechende Datum in den genannten Formaten zu erhalten.
const { format } = require("date-fns");
console.log(format(new Date(), "dd-MM-yyyy"));
console.log(format(new Date(), "dd/MM/yyyy HH:mm:ss"));
console.log(format(new Date(), "PPPP"));
Sie finden die vollständige Liste der Formate hier.
addDays
Das Verfahren addDays wird verwendet, um eine Frist festzulegen, die nach einigen Tagen liegt.
Wir können einfach jedem Datum Tage hinzufügen, um das Datum des Tages nach einigen Tagen zu erhalten. Es hat viele Anwendungen.
Angenommen, Sie haben nach X Tagen Geburtstag und sind an diesen Tagen beschäftigt. Möglicherweise erinnern Sie sich nicht an den Geburtstag in Ihrem Terminkalender. Sie können einfach die addDays Methode, um Sie nach X Tagen über den Geburtstag zu informieren. Habe den Code.
const { format, addDays } = require("date-fns");
const today = new Date();
// birthday after 6 days
const birthday = addDays(today, 6);
console.log(format(today, "PPPP"));
console.log(format(birthday, "PPPP"));
Ähnlich wie bei der Methode addDays Es gibt andere Methoden wie addHours, subHours, addMinutes, subMinutes, addSeconds, subSeconds, subDays, addWeeks, subWeeks, addYears, subYears, etc .., Sie können die Funktionalität der Methoden mit ihren Namen leicht erraten.
Probiere sie aus.
formatDistance
Das Schreiben von Code zum Vergleichen von Daten von Grund auf ist ein Albtraum. Warum vergleichen wir überhaupt Daten?
Es gibt viele Anwendungen, bei denen Sie Datumsvergleiche gesehen haben. Wenn Sie Social-Media-Websites nutzen, wird ein Slogan erwähnt 1 vor einer Minute, vor 12 Stunden, vor 1 Tag, etc .., Hier verwenden wir den Datumsvergleich vom Datum und der Uhrzeit des Beitrags bis zum aktuellen Datum und der aktuellen Uhrzeit.
Das Verfahren formatDistance macht das gleiche. Es gibt die Lücke zwischen den beiden angegebenen Daten zurück.
Lassen Sie uns ein Programm schreiben, um Ihr Alter zu finden.
const { formatDistance } = require("date-fns");
const birthday = new Date("1956, 01, 28");
const presentDay = new Date();
console.log(`Age: ${formatDistance(presentDay, birthday)}`);
eachDayOfInterval
Angenommen, Sie müssen die Namen und Daten der nächsten X Tage herausfinden. Die Methode eachDayOfInterval hilft uns, die Tage zwischen dem Start- und Enddatum zu finden.
Lassen Sie uns die nächsten 30 Tage von heute herausfinden.
const { addDays, eachDayOfInterval, format } = require("date-fns");
const presentDay = new Date();
const after30Days = addDays(presentDay, 30);
const _30Days = eachDayOfInterval({ start: presentDay, end: after30Days });
_30Days.forEach((day) => {
console.log(format(day, "PPPP"));
});
max and min
Die Methoden max funktioniert min findet die maximalen und minimalen Daten unter den angegebenen Daten. Die Methoden in der date-fns sind sehr vertraut und leicht zu erraten, die Funktionalität dieser Methoden. Schreiben wir einen Code.
const { min, max } = require("date-fns");
const _1 = new Date("1990, 04, 22");
const _2 = new Date("1990, 04, 23");
const _3 = new Date("1990, 04, 24");
const _4 = new Date("1990, 04, 25");
console.log(`Max: ${max([_1, _2, _3, _4])}`);
console.log(`Min: ${min([_1, _2, _3, _4])}`);isEqual
Sie können die Funktionalität der Methode leicht erraten isEqual. Wie du denkst die Methode isEqual wird verwendet, um zu überprüfen, ob zwei Daten gleich sind oder nicht. Siehe den folgenden Beispielcode.
const { isEqual } = require("date-fns");
const _1 = new Date();
const _2 = new Date();
const _3 = new Date("1900, 03, 22");
console.log(isEqual(_1, _2));
console.log(isEqual(_2, _3));
console.log(isEqual(_3, _1));
Fazit
Wenn wir über jede Methode in der date-fns Paket, dann dauert es Tage, bis es fertig ist. Der beste Weg, ein Paket kennenzulernen, besteht darin, sich mit den wesentlichen Methoden vertraut zu machen und dann die Dokumentation für weitere Informationen zu lesen. Wenden Sie das gleiche Szenario für die an date-fns Paket auch.
In diesem Tutorial haben Sie die wesentlichen Methoden gelernt. Suchen Sie die spezifische Verwendung in der Dokumentation oder nehmen Sie an Online-Kursen teil, wie z JavaScript, jQuery und JSON.
Viel Spaß beim Codieren 👨💻
