از طریق منوی جستجو مطلب مورد نظر خود در وبلاگ را به سرعت پیدا کنید
روش دریافت تاریخ کنونی در جاوا اسکریپت چه در حال ایجاد یک برنامه روتین روزانه، چه وبلاگ خود، یا هر نوع برنامه وب پویا دیگری هستید، احتمالاً باید با تاریخ ها کار کنید. در این مقاله قصد داریم روش دریافت تاریخ جاری در جاوا اسکریپت را بیاموزیم تا بتوانید با موفقیت برنامه های خود را توسعه دهید.
سرفصلهای مطلب
معرفی
چه در حال ایجاد یک برنامه روتین روزانه، وبلاگ خود، یا هر نوع برنامه وب پویا دیگری باشید، احتمالاً باید با تاریخ ها کار کنید. در این مقاله، ما می خواهیم یاد بگیریم که چگونه تاریخ فعلی را در جاوا اسکریپت دریافت کنیم تا بتوانید برنامه های خود را با موفقیت توسعه دهید. در جاوا اسکریپت، گزینه های زیادی برای انتخاب وجود دارد، اما کلاس اصلی مورد استفاده این است Date(). این روش های زیادی دارد و روش استفاده شما از آن بستگی دارد روی فرمت تاریخی که می خواهید دریافت کنید. پس از آن، یک کتابخانه محبوب جاوا اسکریپت را به شما نشان خواهم داد که می تواند برای قالب بندی زمان به طور کلی، و نه فقط تاریخ، استفاده شود.
با استفاده از تاریخ() کلاس
Date() زمانی که در مورد زمان صحبت می شود، یک کلاس پیشرو در جاوا اسکریپت است. راه های مختلفی برای دریافت زمان و تاریخ به صورت دانه بندی شده از این کلاس وجود دارد!
استفاده کردن getDate()، getMonth() و getFullYear() مواد و روش ها
نکته برای متد getDate: اولین چیزی که هنگام استفاده از این روش به آن توجه می شود این است که ما از آن استفاده می کنیم getDate و نه getDay. دلیل آن این است که getDay متد روز هفته را برمی گرداند، بنابراین از آنجایی که اکنون که دارم می نویسم، جمعه است getDay متد 5 را برمی گرداند getDate در واقع آنچه را که در این مورد نیاز داریم انجام می دهد، شماره روز ماه را برمی گرداند. بنابراین برای من، در حال حاضر روز ماه 21 است (چون 21.05.2021 است.). این روش‌ها به راحتی اشتباه گرفته می‌شوند، بنابراین من می‌خواستم سرم را رها کنم.
نکته برای روش getMonth: نکته دیگری که باید مراقب آن بود این است که شاخص های ماه از 0 شروع می شود، بنابراین ژانویه 0، فوریه 1 و غیره است. اصولاً وقتی شماره ماه را بازیابی می کنیم باید 1 را اضافه کنیم.
اکنون که مشکلات احتمالی را برطرف کردیم، اجازه دهید کدنویسی کنیم:
let date = new Date()
let day = date.getDate();
let month = date.getMonth()+1;
let year = date.getFullYear();
let fullDate = `${day}.${month}.${year}.`;
console.log(fullDate);
در ابتدا کلاس را مثال می زنیم Date و برای هر قسمت از تاریخ، از یک متغیر برای شکستن آن و بررسی هر کدام استفاده می کنیم.
ما نتایج هر روش را در یک متغیر جداگانه قرار دادیم و سپس از درون یابی رشته ای برای ایجاد یک تاریخ کامل استفاده کردیم. درون یابی رشته ای زمانی است که متغیرها را به رشته ارسال می کنیم. در جاوا اسکریپت این بین تیک های برگشتی (“) و قرار دادن متغیرها در آن به دست می آید ${variableName}. اگر درون یابی رشته ای را ترجیح نمی دهید، راه دیگر این است که به سادگی به هم پیوستن (افزودن) رشته ها با هم مانند این:
let fullDate = day + "." + month + "." + year + ".";
نتایج ما در هر مورد یکسان خواهد بود:
21.5.2021. // string interpolation
21.5.2021. // string concatenation
بگویید می خواهید ماه را به عنوان نشان دهید 05 و نه 5. متأسفانه جاوا اسکریپت داخلی است Date کلاس مانند کتابخانه های دیگر گزینه های زیادی برای قالب بندی تاریخ ها به رشته ها ندارد. بنابراین در این مورد باید خودمان قالب بندی را انجام دهیم، که می توانیم با برخی از روش های جاوا اسکریپت انجام دهیم. روی رشته ها مانند padStart(length, substring). کاری که انجام می دهد این است که رشته ما را با the “پد” می کند (یعنی پیشوندها).substring، تا زمانی که برسد length. بنابراین از آنجایی که می خواهیم بسازیم 05 از جانب 5، می خواهیم رشته را با “0” اضافه کنیم تا به طول 2 برسد. قبل از همه اینها، باید قالب date.getMonth()+1 تایپ کردن String. ریخته گری به صراحت نوع متغیر را از یکی به دیگری تغییر می دهد. در اینجا نوع را تغییر می دهیم number تایپ کردن String. ما month متغیر به:
let month = String(date.getMonth()+1).padStart(2, "0");
این فرمت تاریخ ما را به:
21.05.2021.
استفاده کردن toJSON() روش
روش قبلی فضایی را برای قالب‌بندی تاریخ گذاشت. شما می توانید یک تاریخ مانند dd/mm/yyyy، dd-mm-yyyy، dd.mm.yyyy و تمام تغییرات دیگر مربوط به ترتیب روز، ماه و سال. هنگام استفاده از toJSON()، a را برمی گرداند yyyy-mm-dd فرمت در کنار قالب زمان، hh:mm:ss.ms.
بیایید این رویکرد را پیش نمایش کنیم:
let date = new Date().toJSON();
console.log(date);
این خروجی خواهد داشت:
2021-05-21T13:42:07.553Z
شما باید خروجی مشابه این را ببینید، اما بدیهی است که خروجی شما بسته به آن متفاوت خواهد بود روی وقتی کد را اجرا کردید می بینیم که ما فقط به تاریخ نیاز داریم که 10 کاراکتر اول است، بنابراین بیایید از جاوا اسکریپت استفاده کنیم. slice() روش. روش slice(a, b) یک رشته را از نقطه برش می دهد a به اشاره b; در مثال ما از 0 تا 10. بیایید آن را امتحان کنیم:
let date = new Date().toJSON().slice(0, 10);
این باز خواهد گشت:
2021-05-21
ما می توانیم این رشته را بیشتر برش دهیم، بنابراین می توانیم قطعات را به متغیرها مرتب کنیم day, month و year، اما ممکن است زیاده روی کنید، بنابراین اگر به فرمت متفاوتی نیاز دارید، فقط از یک رویکرد متفاوت استفاده کنید.
استفاده کردن toISOSstring(),_ toUTCString()_ و toLocaleDateString() مواد و روش ها
حقیقت خنده دار: toISOString() دقیقا همان نتیجه را برمی گرداند toJSON()، بنابراین از آن می گذریم و مستقیماً وارد آن می شویم toUTCString().
استفاده کردن toUTCString()
let date = new Date().toUTCString();
console.log(date);
خروجی را به ما می دهد:
Fri, 21 May 2021 13:53:30 GMT
این قالب همچنین تاریخ و زمان را با اضافه شدن روز هفته برمی گرداند. همانطور که گفتم در toJSON() بخش، می‌توانید این نتیجه را بیشتر تجزیه کنید، اما احتمالاً غیرضروری است زیرا رویکردهای متفاوتی دارید. از آنجایی که ما فقط تاریخ را دریافت می کنیم، می توانیم این را برش دهیم. در حال حاضر نیازی به بازیگری نیست، زیرا این در حال حاضر یک String:
let date = new Date().toUTCString().slice(5, 16);
این خروجی مورد نظر را به ما می دهد:
21 May 2021
استفاده کردن toLocaleDateString()
این روش تاریخ را در قالبی مطابق با زبان سیستم شما برمی گرداند. حتی گزینه ای برای ارسال زبان مورد نظر به عنوان آرگومان و حتی گزینه های ساده قالب بندی تاریخ مانند weekday، month، dayو غیره ما این را به 3 مثال تقسیم می کنیم:
-
گزینه های پیش فرض
بیایید ببینیم وقتی متد را بدون هیچ آرگومان فراخوانی می کنیم چه اتفاقی می افتد:
let date = new Date().toLocaleDateString(); console.log(date);خروجی، برای من، خواهد بود:
5/21/2021این خروجی بستگی دارد روی محل شما، منطقه من ایالات متحده است، بنابراین قالب به عنوان فرمت تاریخ ایالات متحده خواهد بود.
-
تنها اولویت زبان را پاس می کند
اگر می خواهید محلی خاص را تعریف کنید، می توانید آن را به عنوان یک آرگومان رشته ای ارسال کنید، مانند:
let date = new Date().toLocaleDateString("fr-FR"); console.log(date);این
fr-FRیک کد محلی برای فرانسه است. می توانید تمام کدهای محلی را پیدا کنید اینجا.فرمت تاریخ فرانسوی است
dd/mm/yyyy، بنابراین خروجی به صورت زیر خواهد بود:21/5/2021 -
عبور از هر دو اولویت زبان و گزینه ها
در نهایت، بیایید گزینه های ممکن را مرور کنیم. فقط ماه و روز هفته می تواند مقدار “طولانی” داشته باشد یا “عددی”. روز و سال فقط می تواند “عددی” باشد:
- روز
- ماه
- سال
- روز هفته
const dateOptions = {
day: 'numeric',
month: 'long',
year: 'numeric'
};
console.log(event.toLocaleDateString('fr-FR', dateOptions));
حذف خواهیم کرد weekday از آنجایی که ما فقط به تاریخ نیاز داریم. این باید خروجی دهد:
21 mai 2021
حالا شما کمی زبان فرانسه را نیز یاد گرفتید.
استفاده کردن اکنون()
روش now() تعداد میلی ثانیه های سپری شده از 1 ژانویه 1970 را برمی گرداند – که آغاز دوره یونیکس در برنامه نویسی است. اگر عدد میلی ثانیه را به عدد ارسال کنیم Date سازنده، می توانیم تاریخ فرمت ISO را دریافت کنیم. بیایید آن را امتحان کنیم:
let time = Date.now()
console.log(time);
که دوباره خروجی می دهد برای من:
1621608925212
حالا اگر از آن عبور کنیم time برای سازنده، همانطور که در بالا ذکر شد، می‌توانیم یک آبجکت date با آن زمان ایجاد کنیم:
let date = new Date(time);
console.log(time);
این خروجی خواهد داشت:
2021-05-21T14:55:25.212Z
و ما قبلاً می دانیم که چگونه process این، با استفاده از slice().
استفاده کردن moment.js
این فقط یک جایگزین برای استفاده از تمام روش های قبلی است، کتابخانه ای که به طور خاص برای تاریخ ها و زمان ها در جاوا اسکریپت ساخته شده است. می توانید از اینجا به وب سایت آنها مراجعه کنید. اگرچه این کتابخانه دارای چندین ویژگی است، من فقط به روش ایجاد و انجام قالب بندی ساده برای تاریخ می پردازم. بیایید ببینیم چگونه کار می کند:
moment.format();
moment.format('Do MMMM YYYY');
moment.format('Do MMMM YY');
اگر چیزی را برای قالب‌بندی ارسال نکنید، یک نمایش ISO از تاریخ دریافت خواهید کرد، با این حال، می‌توانید هر قالبی را که می‌خواهید (و که در مستندات Moment تعریف شده است) انتخاب کنید.
کد بالا خروجی خواهد داشت:
2021-05-21T17:17:02+02:00
May 21st 2021
May 21st 21
اگر تنها چیزی که به دنبال آن هستید بازیابی تاریخ فعلی باشد، این گزینه بهترین نیست. این به این دلیل است که کتابخانه Moment بسیار بزرگ است و زمانی که در برنامه‌های فرانت‌اند استفاده می‌شود، کد JS شما را از بین می‌برد. از طرف دیگر، اگر به دستکاری تاریخ و زمان یا قالب بندی پیشرفته تر نیاز دارید، این یک کتابخانه عالی است.
نتیجه
راه های متعددی برای بازیابی تاریخ در جاوا اسکریپت وجود دارد، فقط باید یکی را انتخاب کنید که متناسب با مورد شما باشد. برای نیازهای بسیار ساده، مانند ایجاد تاریخ یا قالب بندی بسیار ساده، می توانید از داخلی استفاده کنید Date کلاس اگر به چیزی کمی پیچیده تر با تاریخ و زمان نیاز دارید، moments.js یک کتابخانه برای انتخاب است.
منتشر شده در 1403-01-16 07:56:03
