Práce s daty Použití date-fns v JavaScriptu

Práce s daty není snadný úkol. Balíček date-fns však usnadňuje práci s daty v JavaScriptu.

Pojďme se hluboce ponořit do balíčku date-fns, abychom si usnadnili život než dříve. Balíček date-fns je lehký.

Instalace balíčku

Musíme nastavit projekt pomocí npm, aby fungoval s balíčkem třetí strany. Pojďme se rychle podívat na kroky k dokončení našeho nastavení.

Předpokládám, že máte nainstalovaný NodeJS nebo IDE, abyste to mohli procvičit.

• Přejděte do požadovaného adresáře, ve kterém chcete pracovat.
• Spusťte příkaz npm init pro inicializaci projektu.
• Odpovězte na všechny otázky podle svých preferencí.
• Nyní nainstalujte date-fns pomocí níže uvedeného příkazu

npm install date-fns

• Vytvořte soubor s názvem dateFunctions.js

Nyní jsme připraveni skočit do balíčku date-fns. Pojďme se naučit některé základní metody z balíčku.

je platná

Všechna data nejsou platná.

Například neexistuje datum jako 2021-02-30. Jak můžeme zkontrolovat, zda je datum platné nebo ne?

Metoda isValid from the date-fns the package nám pomůže zjistit, zda je dané datum platné nebo ne.

Zkontrolujte, zda následující kód funguje správně nebo ne s platností dat.

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

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

Pokud provedete výše uvedený kód, zjistíte, že 30. únor 2021 je platný. Ach! To není.

proč se to děje?

JavaScript převádí další únorový den na 1. březen 2021, což je platné datum. Chcete-li to potvrdit, vytiskněte na konzoli nové datum („2021, 02, 30“).

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

Balíček date-fns poskytuje metodu nazvanou parse, která tento problém vyřeší. Metoda analyzuje vámi zadané datum a vrátí přesné výsledky.

Podívejte se na níže uvedený kód.

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át

Jedním ze základních použití při práci s daty je jejich formátování, jak chceme. Data formátujeme v různých formátech pomocí metody formátování z balíčku date-fns.

Formátujte datum jako 23-01-1993, 1993-01-23 10:43:55, úterý, 23. ledna 1993 atd.. Spusťte následující kód, abyste získali odpovídající datum ve zmíněných formátech.

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

Kompletní seznam formátů naleznete tady.

addDays

Metoda addDays se používá k nastavení termínu, který je po nějakém počtu dní.

Jednoduše, můžeme přidat dny k jakémukoli datu a získat datum dne po několika dnech. Má mnoho aplikací.

Řekněme, že máte narozeniny po X dnech a jste v těchto dnech zaneprázdněni. Možná si ve svém nabitém programu nevzpomenete na narozeniny. Můžete jednoduše využít metodu addDays k upozornění na narozeniny po X dnech. Mějte 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"));

Podobně jako u metody addDays existují i ​​další metody jako addHours, subHours, addMinutes, subMinutes, addSeconds, subSeconds, subDays, addWeeks, subWeeks, addYears, subYears atd.. Funkčnost metod snadno odhadnete podle jejich názvů.

Vyzkoušejte je.

formátVzdálenost

Psaní kódu pro porovnání dat od začátku je noční můra. Proč vlastně data porovnáváme?

Existuje mnoho aplikací, kde jste viděli srovnání dat. Pokud použijete webové stránky sociálních médií, objeví se slogan zmiňující před 1 minutou, před 12 hodinami, před 1 dnem atd.. Zde používáme srovnání data od data a času příspěvku k prezentaci data a času.

Metoda formatDistance dělá totéž. Vrátí mezeru mezi danými dvěma daty.

Pojďme napsat program, který zjistí váš věk.

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

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

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

everyDayOfInterval

Řekněme, že musíte najít jména a data o dalších X dnech. Metoda everyDayOfInterval nám pomáhá najít dny mezi počátečním a koncovým datem.

Pojďme zjistit příštích 30 dní ode dneška.

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 a min

Metody max a min vyhledá maximální a minimální datum mezi danými daty. Metody v date-fns jsou velmi známé a snadno uhodnout funkčnost těchto metod. Pojďme napsat nějaký kód.

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

je roven

Funkčnost metody isEqual můžete snadno odhadnout. Jak si myslíte, metoda isEqual se používá ke kontrole, zda jsou dvě data stejná nebo ne. Viz ukázkový kód níže.

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

Závěr

Pokud mluvíme o každé metodě v balíčku date-fns, pak její dokončení trvá několik dní. Nejlepší způsob, jak se naučit jakýkoli balíček, je seznámit se s jeho základními metodami a poté si přečíst dokumentaci pro další informace. Použijte stejný scénář také pro balíček date-fns.

V tomto tutoriálu jste se naučili základní metody. Hledejte konkrétní použití v dokumentace nebo zvažte absolvování online kurzů jako např JavaScript, jQuery a JSON.

Veselé kódování 👨‍💻