از طریق منوی جستجو مطلب مورد نظر خود در وبلاگ را به سرعت پیدا کنید
روش قالب بندی تاریخ ها در جاوا اسکریپت برای برنامه های کاربردی وب به خصوص، قالب بندی تاریخ یک کار بسیار رایج است. تقریباً به هر وب سایتی نگاهی بیندازید، خواه یک سرویس گیرنده ایمیل مانند جیمیل، توییتر یا حتی روی مقالات سوء استفاده پشته، به ناچار یک رشته تاریخ/زمان در جایی وجود دارد روی را page. در بسیاری از موارد، به ویژه برنامه های …
سرفصلهای مطلب
مخصوصاً برای برنامه های وب، قالب بندی تاریخ یک کار بسیار رایج است. تقریباً به هر وب سایتی نگاهی بیندازید، خواه یک سرویس گیرنده ایمیل مانند جیمیل، توییتر یا حتی روی مقالات سوء استفاده پشته، به ناچار یک رشته تاریخ/زمان در جایی وجود دارد روی را page. در بسیاری از موارد، به ویژه برنامه هایی که به صورت پویا محتوای فرانت اند تولید می کنند، تاریخ ها با کد جاوا اسکریپت فرمت می شوند. بنابراین می‌توانم بگویم می‌توان فرض کرد که این وظیفه‌ای است که معمولاً با آن روبرو می‌شوید.
هر یک از بخش های زیر یک روش (یا کتابخانه) را توضیح می دهد که می توانید از آن برای قالب بندی تاریخ ها در جاوا اسکریپت استفاده کنید. از آنجایی که چند راه مختلف برای رسیدن به این هدف وجود دارد، من آنها را به ترتیب ترجیح شخصی خود فهرست کرده ام. با این حال، ممکن است متوجه شوید که یکی از راه‌حل‌های زیر به دلایلی برای برنامه شما کار نمی‌کند، در این صورت می‌توانید به دنبال چیزی که بیشتر با نیازهای شما مطابقت دارد، به پایین‌تر از فهرست نگاه کنید.
Moment.js
Moment.js به طور گسترده ای به عنوان بهترین کتابخانه تاریخ برای جاوا اسکریپت در نظر گرفته می شود و دلیل خوبی نیز دارد. استفاده از آن بسیار آسان است، به خوبی مستند شده است و اندازه آن کمتر از 20 کیلوبایت (کوچک شده، gzip شده) است. هم با Node.js و هم با جاوا اسکریپت سمت مرورگر کار می کند و به شما امکان می دهد از آن در کل پایگاه کد خود استفاده کنید. این یک مزیت بسیار بزرگ است با توجه به اینکه شما فقط باید یک کتابخانه تاریخ-زمان واحد را یاد بگیرید، صرف نظر از اینکه در حال برنامه نویسی قسمت جلویی یا پشتی هستید.
قبل از پرداختن به قالب‌بندی تاریخ‌ها، بیایید از Node REPL برای بررسی کوتاه استفاده کنیم moment آغازگر:
> const moment = require('moment');
> let m = moment(); // Create a new date, which defaults to the current time
> m = moment('2016-08-02 15:37'); // Parse an ISO 8601 date string
> m.month(9); // Set month to October - months are 0-indexed!
راه‌های زیادی برای ایجاد، تجزیه و دستکاری تاریخ‌ها با Moment وجود دارد که در اینجا به طور کامل به آنها نمی‌پردازیم. برای یک نمای کلی خوب از کل کتابخانه، مقاله ما را بررسی کنید، Moment.js: کتابخانه تاریخ بهتر برای جاوا اسکریپت.
اکنون که تقریباً می‌دانید چگونه از Moment برای ایجاد و دستکاری تاریخ‌ها استفاده کنید، بیایید ببینیم چگونه از آن برای قالب‌بندی تاریخ‌ها به صورت رشته‌ای استفاده کنیم.
ساده ترین راه برای شروع استفاده از آن است .format() روش بدون آرگومان:
> moment().format();
'2016-08-02T15:44:09-05:00'
این اراده print از تاریخ فرمت شده در ISO 8601 استاندارد با این حال، مگر اینکه تاریخ ذخیره شدن را در JSON یا چیزی مشابه چاپ کنید، احتمالاً نمی‌خواهید کاربرانتان مجبور باشند با تاریخ‌هایی که به این شکل به نظر می‌رسند دست و پنجه نرم کنند. استفاده کردن فرمت نشانه ها، خرما را می توان به دلخواه سفارشی کرد.
اگر از زبان دیگری مانند جاوا یا پایتون وارد جاوا اسکریپت شده اید، احتمالاً با مفهوم نشانه های قالب بندی تاریخ آشنا خواهید بود. اگرچه، یک هشدار، فرض نکنید که نشانه های زبان دیگر دقیقاً مشابه موارد استفاده شده در Moment هستند. ابتدا باید با اسناد مشورت کنید زیرا تفاوت های زیادی وجود دارد.
با .format() روش، می‌توانید رشته‌ای از نشانه‌ها بسازید که به یک جزء خاص از یک تاریخ (مانند روز، ماه، دقیقه، یا am/pm) اشاره دارد.
به عنوان مثال، فرض کنید فقط می خواهید یک نمایش ساده از زمان فعلی (ساعت: دقیقه: ثانیه صبح/ظهر) را ببینید. ما می توانیم این را با:
> moment().format('(The time is) h:mm:ss a');
'The time is 4:47:09 pm'
در اینجا خلاصه ای از توکن هایی است که در بالا مشاهده می کنید:
(The time is): تمام متن داخل پرانتز (()) توسط تجزیه کننده نادیده گرفته می شودh: ساعت (بدون صفر اول)mm: دقیقه (با صفر اول)ss: ثانیه (با صفر اول)a: ante/post meridiem (صبح/بعدازظهر)
تمام متن های محصور شده در پرانتز و نویسه های غیر الفبایی، مانند کاراکترهای دو نقطه (‘:’)، توسط تجزیه کننده نادیده گرفته می شوند. به این ترتیب می توانید قالب بندی را به رشته های خود اضافه کنید.
رشته های قالب بندی می توانند کمی پیچیده تر از مثال ما در بالا باشند. مثلا اگر بخواهید print در هر ماه، 5 راه برای انجام این کار وجود دارد:
M: شماره ماه (1، 2، 3… 12)Mo: شماره ماه با نشانگر ترتیبی (اول، دوم، سوم… دوازدهم)MM: عدد ماه با صفر اول (01، 02، 03… 12)MMM: مخفف ماه (ژان، فوریه، مارس… دسامبر)MMMM: نام ماه (ژانویه، فوریه، مارس… دسامبر)
زمانی که تغییرات زیادی را برای روز ماه، روز هفته، ساعت، سال و غیره در نظر بگیرید، فهرست انتخاب‌ها بسیار طولانی‌تر می‌شود. هنگامی که مفهوم را یاد بگیرید و کمی با آن بازی کنید، بقیه کارها آسان می‌شود. اگرچه فراموش کردن توکن ها آسان است، بنابراین هنگام برنامه نویسی، مرجع را در دسترس داشته باشید.
همچنین برای هر دو منطقه زمانی و سفارشی کردن تاریخ های قالب بندی شده توسط مناطق مختلف، پشتیبانی عالی وجود دارد. این معمولاً برای برنامه های کوچک مشکل بزرگی نیست، اما برای برنامه های بزرگتر می تواند دردسر بزرگی باشد. اگر نیاز به حمایت از بین المللی شدن دارید، Moment برای شما نجات بخش خواهد بود.
Moment روش مورد علاقه من برای مدیریت، دستکاری و قالب بندی رشته ها در جاوا اسکریپت است، بنابراین پیشنهاد می کنم آن را بررسی کنید. اگرچه، همه نمی‌توانند وابستگی‌های اضافی اضافه کنند، مخصوصاً برای توسعه front-end، به این معنی که ممکن است لازم باشد یکی از دو گزینه قالب‌بندی بعدی را امتحان کنید.
بسته بندی با فرمت تاریخ
dateformat شبیه Moment است که تاریخ ها را با استفاده از رشته های رمز قالب بندی می کند، اما این کار را کمی متفاوت انجام می دهد. با استفاده از نسخه مرورگر از datetime، آن را گسترش خواهد داد Date مخالفت داشتن a .format() روش، که بسیار شبیه به روش فرمت Moment عمل می کند:
سمت مرورگر
today = new Date();
today.format('dd-m-yy'); // Returns '02-8-16'
با نسخه Node.js، کمی متفاوت عمل می کند. به جای تمدید Date.prototype شامل شدن format()، باید استفاده کنید dateformat به عنوان یک روش خود و پاس خود را Date هدف – شی:
Node.js
> const dateformat = require('dateformat');
> let now = new Date();
> dateformat(now, 'dddd, mmmm dS, yyyy, h:MM:ss TT');
'Tuesday, August 2nd, 2016, 5:45:19 PM'
جدا از روش فراخوانی روش قالب‌بندی، همه قالب‌بندی توکن‌ها بین نسخه‌های مرورگر و Node.js یکسان عمل می‌کنند.
یکی دیگر از مزایای استفاده dateformat فرمت های نامگذاری شده آن است. در حالی که هرکسی ترجیحات خود را در مورد روش قالب بندی تاریخ ها دارد، در واقع فقط چند فرمت مختلف وجود دارد اکثر مردم استفاده می کنند. هدف این کتابخانه این است که با ارائه فرمت های رایج تاریخ با نام، از همه کارهای تکراری جلوگیری کند:
Node.js
> const dateformat = require('dateformat');
> let now = new Date();
> dateformat(now, 'fullDate');
'Tuesday, August 2, 2016'
> dateformat(now, 'longTime');
'5:45:19 PM CDT'
بیش از 10 مورد از این قالب های نامگذاری شده ارائه شده است. برای مشاهده لیست کامل، اسناد (پیوند شده در بالا) را بررسی کنید.
همچنین ممکن است این کتابخانه را به دلیل اندازه کوچکش مناسب‌تر بیابید. حجم فایل فقط 1.2 کیلوبایت در صورت Minify و Gzip می باشد. با توجه به مزیتی که دارد بد نیست.
Date.toLocaleString()
در حال حاضر، در حالی که من استفاده از این روش را توصیه نمی کنم، می دانم که بر اساس آن است روی محدودیت های پروژه این ممکن است تنها انتخاب شما باشد. همچنین مهم است که به این نکته اشاره کنیم زیرا این تنها راه داخلی برای قالب‌بندی رشته‌های تاریخ است، بنابراین ممکن است در نقطه‌ای از مسیر مفید باشد.
با استفاده از داخلی Date.toLocaleString() روش یک روش بدون وابستگی برای قالب‌بندی تاریخ‌زمان‌های شما است. با این حال، در سافاری پشتیبانی نمی‌شود و فقط در نسخه‌های بعدی سایر مرورگرهای اصلی پشتیبانی می‌شود، بنابراین ممکن است انتخاب خوبی نباشد (مگر اینکه از Node استفاده می‌کنید). به هر حال، بیایید ببینیم چگونه کار می کند.
به جای استفاده از رشته های نشانه مانند کتابخانه های بالا، در اینجا از an استفاده می کنیم options شیئی که در آن هر قسمت از تاریخ شما می تواند پیکربندی شود.
به عنوان مثال، به جای mm برای یک ساعت 2 رقمی، استفاده می کنیم {hour: '2-digit'}. همین امر در مورد سایر اجزای تاریخ مانند روز هفته، سال، ماه، روز و غیره صدق می کند.
let now = new Date();
let options = {
weekday: 'long',
year: 'numeric',
month: 'short',
day: 'numeric',
hour: '2-digit',
minute: '2-digit'
};
now.toLocaleString('en-us', options); // Returns 'Tuesday, Aug 2, 2016, 6:03 PM'
همانطور که می بینید، با استفاده از .toLocaleString() روش بسیار پرمخاطب تر از سایر روش های قالب بندی است که در طول این مقاله دیده ایم.
برخی از متداول‌ترین مؤلفه‌های تاریخ که می‌توانید در شی گزینه (و مقادیر احتمالی آنها) تنظیم کنید عبارتند از:
weekday: باریک، کوتاه، بلندyear: عددی، 2 رقمیmonth: عددی، دو رقمی، باریک، کوتاه، بلندday: عددی، 2 رقمیhour: عددی، 2 رقمیminute: عددی، 2 رقمیsecond: عددی، 2 رقمی
همین اثر قالب بندی را می توان با انجام داد .toLocaleString()، اما فقط کمی تلاش بیشتری می خواهد.
نتیجه
جاوا اسکریپت/Node.js تعداد زیادی کتابخانه دارد که می‌توانند رشته‌های تاریخ را برای شما قالب‌بندی کنند، اما من فقط چند روش محبوب‌تر را در این مقاله نشان دادم. هر کدام مزایای خاص خود را دارند، بنابراین باید ارزیابی کنید که کدام یک برای شما بهتر است.
کدام کتابخانه تاریخ-زمان را ترجیح می دهید؟ آیا مواردی وجود دارد که در اینجا ذکر نشده است که باید ذکر می شد؟ در نظرات به ما اطلاع دهید!
منتشر شده در 1403-01-28 09:26:04
