العمل مع التواريخ باستخدام تاريخ - fns في جافا سكريبت

نشرت: 2021-03-26

العمل مع التواريخ ليس مهمة سهلة. لكن date-fns الحزمة يجعل من السهل التعامل مع التواريخ في JavaScript.

دعونا date-fns الحزمة 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")));

إذا قمت بتنفيذ الكود أعلاه ، فستجد أن 30th February 2021 صالح. أوه! ليست كذلك.

لماذا يحدث ذلك؟

يحول JavaScript اليوم الإضافي من فبراير إلى 1st March 2021 وهو تاريخ صالح. لتأكيد ذلك ، اطبع new Date("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));

صيغة

أحد الاستخدامات الأساسية أثناء العمل مع التواريخ هو تكوينها كما نريد. نقوم بتنسيق التواريخ بتنسيقات مختلفة باستخدام طريقة format من حزمة date-fns .

قم بتنسيق التاريخ كـ 23-01-1993 ، 1993-01-23 10:43:55 ، Tuesday, January 23rd 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"));

يمكنك العثور على القائمة الكاملة للصيغ هنا.

أيام add

يتم استخدام طريقة 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 ، وما إلى ذلك .. ، يمكنك بسهولة تخمين وظائف الطرق بأسمائها.

جربهم في الخارج.

شكل المسافة

كتابة الكود لمقارنة التواريخ من الصفر كابوس. لماذا نقارن التواريخ على أي حال؟

هناك العديد من التطبيقات التي شاهدت فيها مقارنات بين التواريخ. إذا كنت تأخذ مواقع التواصل الاجتماعي، سيكون هناك شعار بالذكر منذ 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)}`);

everyDayOfInterval

لنفترض أنه عليك البحث عن أسماء وتواريخ أيام X التالية. eachDayOfInterval الطريقة eachDayOfInterval في العثور على الأيام بين تاريخ البدء وتاريخ eachDayOfInterval .

دعنا نتعرف على الثلاثين يومًا القادمة من اليوم.

 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 الأمر أيامًا حتى تكتمل. أفضل طريقة لمعرفة أي حزمة هي التعرف على الأساليب الأساسية منها ثم قراءة الوثائق للحصول على مزيد من المعلومات. قم date-fns نفس السيناريو على حزمة date-fns أيضًا.

لقد تعلمت الأساليب الأساسية في هذا البرنامج التعليمي. ابحث في الاستخدام المحدد في الوثائق أو فكر في أخذ دورات عبر الإنترنت مثل JavaScript و jQuery و JSON.

ترميز سعيد