Работата с дати не е лесна задача. Но пакетът date-fns улеснява работата с датите в JavaScript.
Нека се потопим в пакета date-fns, за да направи живота ни по-лесен от преди. Пакетът date-fns е лек.
Съдържание
Инсталиране на пакета
Трябва да настроим проекта с npm, за да работи с пакет на трета страна. Нека бързо да видим стъпките за завършване на нашата настройка.
Предполагам, че имате инсталиран NodeJS или IDE, за да практикувате това.
- Отидете до желаната директория, в която искате да работите.
- Изпълнете командата npm init, за да инициализирате проекта.
- Отговорете на всички въпроси според вашите предпочитания.
- Сега инсталирайте date-fns, като използвате командата по-долу
npm install date-fns
- Създайте файл, наречен dateFunctions.js
Сега сме готови да преминем към пакета date-fns. Да отидем и да научим някои основни методи от пакета.
е валиден
Всички дати не са валидни.
Например, няма дата като 2021-02-30. Как можем да проверим дали датата е валидна или не?
Методът isValid от date-fns пакета ще ни помогне да разберем дали дадената дата е валидна или не.
Проверете дали следният код работи добре или не с валидността на датите.
const { isValid } = require("date-fns");
console.log(isValid(new Date("2021, 02, 30")));
Ако изпълните горния код, ще откриете, че 30 февруари 2021 г. е валиден. о! Не е.
Защо се случва?
JavaScript преобразува допълнителния ден от февруари в 1 март 2021 г., което е валидна дата. За да го потвърдите, отпечатайте нова дата („2021, 02, 30“) на конзолата.
console.log(new Date("2021, 02, 30"));
Пакетът date-fns предоставя метод, наречен parse, за да заобиколи този проблем. Методът parse анализира датата, която сте посочили, и връща точни резултати.
Разгледайте кода по-долу.
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));
формат
Една от основните употреби при работа с дати е форматирането им, както искаме. Ние форматираме датите в различни формати, използвайки метода за форматиране от пакета date-fns.
Форматирайте датата като 23-01-1993, 1993-01-23 10:43:55, вторник, 23 януари 1993 г. и т.н., Изпълнете следния код, за да получите съответната дата в споменатите формати.
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"));
Можете да намерите пълния списък с формати тук.
addDays
Методът addDays се използва за задаване на краен срок, който е след определен брой дни.
Просто можем да добавим дни към всяка дата, за да получим датата на деня след няколко дни. Има много приложения.
Да приемем, че имате рожден ден след X дни и сте заети през тези дни. Може да не помните рождения ден в натоварения си график. Можете просто да използвате метода addDays, за да ви уведоми за рождения ден след X дни. Имайте кода.
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"));
Подобно на метода addDays има други методи като addHours, subHours, addMinutes, subMinutes, addSeconds, subSeconds, subDays, addWeeks, subWeeks, addYears, subYears и т.н.. Можете лесно да познаете функционалността на методите с техните имена.
Опитайте ги.
formatDistance
Писането на код за сравняване на дати от нулата е кошмар. Защо все пак сравняваме датите?
Има много приложения, в които сте виждали сравнения на дати. Ако вземете уебсайтове на социални медии, ще има слоган, който споменава преди 1 минута, преди 12 часа, преди 1 ден и т.н. Тук използваме сравнение на дати от датата и часа на публикацията до настоящата дата и час.
Методът formatDistance прави същото. Връща празнината между дадените две дати.
Нека напишем програма, която да намери вашата възраст.
const { formatDistance } = require("date-fns");
const birthday = new Date("1956, 01, 28");
const presentDay = new Date();
console.log(`Age: ${formatDistance(presentDay, birthday)}`);
всекиДенОтИнтервал
Да речем, че трябва да намерите имена и дати за следващите X дни. Методът eachDayOfInterval ни помага да намерим дните между началната и крайната дата.
Нека разберем следващите 30 дни от днес.
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 и min намират съответно максималните и минималните дати сред дадените дати. Методите в date-fns са много познати и лесно се отгатва функционалността на тези методи. Нека напишем малко код.
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. Както мислите, методът isEqual се използва за проверка дали две дати са равни или не. Вижте примерния код по-долу.
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));
Заключение
Ако говорим за всеки метод в пакета date-fns, тогава завършването му отнема дни. Най-добрият начин да научите всеки пакет е да се запознаете с основните методи от него и след това да прочетете документацията за допълнителна информация. Приложете същия сценарий и за пакета date-fns.
Научихте основните методи в този урок. Потърсете конкретната употреба в документация или помислете за онлайн курсове като JavaScript, jQuery и JSON.
Приятно кодиране 👨💻