Munka dátumokkal A date-fns használata JavaScriptben

A dátumokkal való munka nem könnyű feladat. A date-fns csomag azonban megkönnyíti a dátumokkal való munkát a JavaScriptben.

Merüljünk el mélyen a date-fns csomagban, hogy könnyebbé tegyük életünket, mint korábban. A date-fns csomag könnyű.

A csomag telepítése

Be kell állítanunk a projektet az npm segítségével, hogy harmadik féltől származó csomaggal működjön. Lássuk gyorsan a telepítés befejezésének lépéseit.

Feltételezem, hogy telepítve van a NodeJS vagy az IDE a gyakorlatban.

  • Keresse meg a kívánt könyvtárat, amelyben dolgozni szeretne.
  • Futtassa az npm init parancsot a projekt inicializálásához.
  • Válaszoljon minden kérdésre preferenciája alapján.
  • Most telepítse a date-fn-t az alábbi paranccsal
npm install date-fns
  • Hozzon létre egy dateFunctions.js nevű fájlt

Most már készen állunk, hogy beugorjunk a date-fns csomagba. Menjünk, és tanuljunk meg néhány alapvető módszert a csomagból.

érvényes

Minden dátum nem érvényes.

Például nincs olyan dátum, mint 2021-02-30. Hogyan ellenőrizhetjük, hogy a dátum érvényes-e vagy sem?

Az isValid metódus a dátum-fns csomagból segít megállapítani, hogy az adott dátum érvényes-e vagy sem.

Vizsgálja meg, hogy a következő kód jól működik-e a dátumok érvényessége mellett.

const { isValid } = require("date-fns");

console.log(isValid(new Date("2021, 02, 30")));

Ha végrehajtja a fenti kódot, akkor 2021. február 30-a érvényes. Ó! Ez nem.

  Hogyan játszhatunk Sega játékokat Linuxon a Gens használatával

Miért történik ez?

A JavaScript a februári extra napot 2021. március 1-jévé konvertálja, ami egy érvényes dátum. A megerősítéshez nyomtasson új dátumot („2021, 02, 30”) a konzolra.

console.log(new Date("2021, 02, 30"));

A date-fns csomag egy parse nevű módszert biztosít a probléma megkerülésére. Az elemzési módszer elemzi a megadott dátumot, és pontos eredményeket ad vissza.

Tekintse meg az alábbi kódot.

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));

formátum

A dátumokkal való munka során az egyik alapvető használat a kívánt formázás. A dátumokat a date-fns csomag formázási módszerével különböző formátumokban formázzuk.

Formázza a dátumot 1993-01-23, 1993-01-23 10:43:55, kedd, 1993. január 23. stb. alakban. Futtassa a következő kódot, hogy megkapja a megfelelő dátumot az említett formátumokban.

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"));

A formátumok teljes listáját megtalálja itt.

addDays

Az addDays metódus egy bizonyos számú nap utáni határidő beállítására szolgál.

Egyszerűen bármely dátumhoz hozzáadhatunk napokat, hogy néhány nap után megkapjuk a nap dátumát. Számos alkalmazása van.

Tegyük fel, hogy X nap után van születésnapod, és azokon a napokon elfoglalt vagy. Elfoglaltságai között előfordulhat, hogy nem emlékszik a születésnapjára. Egyszerűen használhatja az addDays metódust, hogy X nap után értesítse Önt a születésnapról. Legyen a kód.

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"));

Az addDays metódushoz hasonlóan vannak más metódusok is, mint addHours, subHours, addMinutes, subMinutes, addSeconds, subSeconds, subDays, addWeeks, subWeeks, addYears, subYears, stb.

  A Képernyőkép-szerkesztő engedélyezése a Google Chrome-ban

Próbáld ki őket.

formátumTávolság

Kódot írni a dátumok nulláról való összehasonlítására egy rémálom. Miért hasonlítjuk össze a dátumokat?

Sok olyan alkalmazás létezik, ahol dátum-összehasonlításokat látott. Ha közösségi oldalakat veszünk, akkor ott lesz egy felirat, amely megemlíti: 1 perce, 12 órája, 1 napja stb.. Itt a dátum-összehasonlítást használjuk a bejegyzés dátumától és időpontjától a jelenlegi dátumig és időpontig.

A formatDistance metódus ugyanezt teszi. A megadott két dátum közötti különbséget adja vissza.

Írjunk programot az életkorod megállapítására.

const { formatDistance } = require("date-fns");

const birthday = new Date("1956, 01, 28");
const presentDay = new Date();

console.log(`Age: ${formatDistance(presentDay, birthday)}`);

everyDayOfInterval

Tegyük fel, hogy meg kell találnia a következő X napra vonatkozó neveket és dátumokat. Az everyDayOfInterval metódus segít megtalálni a kezdő és befejező dátum közötti napokat.

Nézzük meg a következő 30 napot mától.

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 és min

A max és min metódusok rendre megkeresik a megadott dátumok közül a maximális és minimum dátumot. A date-fn metódusai nagyon ismerősek, és könnyen kitalálható a metódusok működése. Írjunk egy kódot.

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])}`);

egyenlő

Könnyen kitalálhatja az isEqual módszer funkcionalitását. Mint gondolja, az isEqual módszerrel ellenőrizhető, hogy két dátum egyenlő-e vagy sem. Lásd az alábbi mintakódot.

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));

Következtetés

Ha minden módszerről beszélünk a date-fns csomagban, akkor napokig tart a befejezés. Bármely csomag megtanulásának legjobb módja, ha megismeri az alapvető módszereket, majd elolvassa a dokumentációt további információkért. Alkalmazza ugyanezt a forgatókönyvet a date-fns csomagra is.

  A Face ID nem működik képernyőcsere után

Ebben az oktatóanyagban megtanulta az alapvető módszereket. Keresse meg a konkrét felhasználást a dokumentáció vagy fontolja meg online tanfolyamok elvégzését, mint pl JavaScript, jQuery és JSON.

Boldog kódolást 👨‍💻