از طریق منوی جستجو مطلب مورد نظر خود در وبلاگ را به سرعت پیدا کنید
Moment.js: کتابخانه تاریخ بهتر برای جاوا اسکریپت همانطور که هر برنامه نویس باتجربه می داند، تاریخ ها و زمان ها در اکثر کدهای سطح برنامه فوق العاده رایج است. شما ممکن است از تاریخ ها برای ردیابی ایجاد یک شی، برای ردیابی زمان از زمان وقوع یک رویداد، یا برای ذخیره تاریخ یک رویداد آینده استفاده کنید. با این حال، کار با تاریخ ها آسان نیست، …
سرفصلهای مطلب
همانطور که هر برنامه نویس باتجربه ای می داند، تاریخ ها و زمان ها در اکثر کدهای سطح برنامه بسیار رایج است. شما ممکن است از تاریخ ها برای ردیابی ایجاد یک شی، برای ردیابی زمان از زمان وقوع یک رویداد، یا برای ذخیره تاریخ یک رویداد آینده استفاده کنید. با این حال، کار با تاریخ ها آسان نیست، بنابراین داشتن کتابخانه ای که هم دقیق باشد و هم رابط کاربری ساده ای داشته باشد، مهم است. جاوا اسکریپت استاندارد Date
شی خیلی بد نیست، اما فاقد برخی ویژگی های مهم است و همیشه کار کردن با آن ساده نیست.
در این مقاله خواهید دید که Moment چگونه تاریخ ها و زمان ها را برای تجزیه، قالب بندی و دستکاری آسان می کند.
تجزیه تاریخ ها
رشته های
به طور پیش فرض، Moment تلاش می کند تا رشته های تاریخ را با استفاده از ISO 8601 قالب، که دارای طیف گسترده ای از تاریخ های معتبر است. شما می توانید با استفاده از این قالب، دقت زمانی را که می خواهید در زمان تاریخ خود مشخص کنید. این برای ما عالی است زیرا تاریخ ممکن است طول بکشد روی بسته به اشکال مختلف روی سطح جزئیاتی که می خواهید مشخص کنید.
با در نظر گرفتن تلاش برای تجزیه همه این فرمت های مختلف روی مال خودت:
- 20160628
- 2016-06-28T09
- 20160628T080910,123
- 2016-06-28 09:30:26.123
- 2016-06-28 09:30:26.123+07:00
همانطور که می بینید، نه تنها دقت زمان تغییر می کند، بلکه قالبی که در آن مشخص شده است می تواند بسیار متفاوت باشد، به همین دلیل است که داشتن یک تجزیه کننده زمان توانمند بسیار مهم است.
اول از همه، ساده ترین راه برای ایجاد یک moment
هدف فراخوانی سازنده بدون آرگومان است:
> const moment = require('moment');
> let m = moment();
این یک شی تاریخ را با زمان فعلی نمونه می کند.
برای تجزیه رشته تاریخ زمان با Moment، کافی است آن را به سازنده ارسال کنید:
> let date = moment('2016-06-28 09:30:26.123');
اگر به دلایلی Moment نتواند رشتهای را که به آن دادهاید تجزیه کند، دوباره به استفاده از داخلی بازمیگردد. new Date()
شیء برای تجزیه
برای بررسی اینکه آیا تاریخ شما تجزیه شده و معتبر است، از .isValid()
روش:
> moment('2016-06-28 09:30:26.123').isValid();
true
> moment('derp').isValid();
false
برای همه اشیاء تاریخی ایجاد شده با Moment، مهم نیست که چگونه آنها را تجزیه یا ایجاد کنید، منطقه زمانی در شیء به طور پیش فرض به منطقه زمانی فعلی خواهد بود، مگر اینکه مستقیماً مشخص شود. برای بازگرداندن زمان UTC، استفاده کنید moment.utc()
بجای. برای اطلاعات بیشتر روی مناطق زمانی، بخش را بررسی کنید مناطق زمانی لحظه ای.
تعیین فرمت ها
یکی از ویژگی های تجزیه مورد علاقه من در Moment، تجزیه کننده رشته/فرمت است. اساساً مانند یک قالبکننده رشته معکوس است. شما رشته تاریخ-زمان را برای تجزیه ارائه می دهید و رشته دیگری که فرمت آن را مشخص میکند. به این ترتیب میتوانید از رشتههایی با هر فرمتی که میخواهید استفاده کنید و همچنان به راحتی از آنها با Moment استفاده کنید.
به عنوان مثال، در ایالات متحده (به دلایلی) ما دوست داریم تاریخ های خود را به صورت «ماه/روز/سال» قالب بندی کنیم، در حالی که بسیاری از کشورهای دیگر جهان تاریخ خود را به صورت «روز/ماه/سال» قالب بندی می کنند. این موضوع جای زیادی برای سردرگمی باقی می گذارد. مثلاً تاریخ «11/06/2016» قرار است 15 آبان باشد یا 11 ژوئن؟
تصویر: جان هاردینگ/مونا چلبی از طریق روزنامه گاردین
بنابراین چگونه متوجه می شویم که تاریخ های شما به درستی تجزیه شده است؟ استفاده از مشخصکنندههای فرمت مانند این تضمین میکند که هیچ ابهامی در تاریخهای شما وجود ندارد، با این فرض که از قبل میدانید در کدام قالب هستند. در مثال زیر، ما همچنان میتوانیم تاریخهای صحیح را با وجود قالبهای متفاوت و احتمالاً گیجکننده، تجزیه کنیم.
> let d1 = moment('11.06.2016', 'DD-MM-YYYY');
> let d2 = moment('06/11/2016', 'MM-DD-YYYY');
> d1.format(); // '2016-06-11T00:00:00-05:00'
> d2.format(); // '2016-06-11T00:00:00-05:00'
توجه داشته باشید که ما همچنین از جداکننده های مختلفی در رشته های تاریخ خود، “.” استفاده می کنیم. و “/”. Moment در واقع تمام کاراکترهای غیرالفبایی را هنگام استفاده از این فرمت ها نادیده می گیرد، بنابراین همیشه لازم نیست نگران تطبیق کامل فرمت ها باشید.
برای مجموعه کاملی از نشانههای قالببندی موجود، بررسی کنید این بخش از اسناد Moment.js.
مهر زمانی یونیکس
همانطور که انتظار دارید، Moment همچنین می تواند تاریخ های عدد صحیح را تجزیه کند (زمان یونیکس) نیز در قالب ثانیه یا میلی ثانیه:
> moment.unix(1467128085); // Date in seconds from 1970
> moment(1467128085747); // Date in milliseconds from 1970
تنها تفاوت در زمان های حاصل در دقت است. millisecondDate
مقداری غیر صفر برای فیلد میلی ثانیه خواهد داشت.
چاپ تاریخ
به نظر من، این یکی از مفیدترین بخش های Moment است، بیشتر به این دلیل که جاوا اسکریپت داخلی است. Date
شی پشتیبانی خیلی خوبی برای آن ندارد. با کمال تعجب، تنها راه داخلی برای انجام قالب بندی Date
استفاده از Date.toLocaleDateString()
روشی که به نظر می رسد بسیار بد و منعطف نیست:
> let d = new Date(1467128085747);
> let options = {
... weekday: 'long', year: 'numeric', month: 'short',
... day: 'numeric', hour: '2-digit', minute: '2-digit'
... };
> date.toLocaleTimeString('en-us', options);
'Tuesday, Jun 28, 2016, 10:34 AM'
با Moment، ما به راحتی میتوانیم به همین قالببندی تنها با یک خط کد (که در بخش بعدی نشان خواهم داد) دست پیدا کنیم.
ما این را به چند زیربخش تقسیم می کنیم. ابتدا، قالببندی سنتی را با نشانهها مرور میکنیم، سپس قالبهای تاریخ نسبی موجود را نشان میدهیم (مانند «18 دقیقه پیش»)، و در نهایت روش قالببندی تاریخها را به عنوان انواع مختلف دادههای ساختاریافته نشان میدهیم. مانند آرایه ها، JSON یا یک جاوا اسکریپت ساده Object
.
قالب بندی
استفاده کنید .format()
روشی برای نمایش تاریخ به صورت رشته ای بدون هیچ استدلالی، رشته را در نمایش ISO 8601 چاپ می کند:
> let date = moment.unix(1467128085);
> date.format();
'2016-06-28T10:34:45-05:00'
در غیر این صورت می توانید فرمت خود را تهیه کرده و با استفاده از توکن ها آن را به دلخواه شخصی سازی کنید.
> date.format('dddd, MMMM Do YYYY, h:mm a');
'Tuesday, June 28th 2016, 10:34 am'
ممکن است متوجه شوید که این همان نمایش است Date.toLocaleTimeString()
مثال از بالا، اما در یک خط. و تمام چیزی که طول کشید رشته بود dddd, MMMM Do YYYY, h:mm a
.
باز هم، لیست کامل نشانه های قالب بندی را می توان در وب سایت مستندات بسیار کامل Moment یافت.
فرمت های نسبی
به عنوان مثال، اغلب اوقات در برنامه های وب، نشان دادن مدت زمان زیادی از وقوع یک رویداد به کاربر مفید است. به جای اینکه خودتان این را محاسبه کنید، Moment برخی از توابع کاربردی را برای مدیریت این قالب بندی برای شما ارائه می دهد.
در همه موارد، می توانید از هر تاریخی از گذشته یا آینده استفاده کنید و رشته برگشتی زمان صحیح را منعکس می کند.
در خارج از جعبه، چند گزینه مختلف دریافت می کنید:
زمان از هم اکنون
با فرض اینکه تاریخ امروز 1 ژوئیه 2016 باشد، قالب بندی نسبی زیر را دریافت خواهید کرد:
> moment({year: 2016, month: 3, day: 13, hour: 10}).fromNow();
'3 months ago'
> moment({year: 2016, month: 9, day: 23, hour: 10}).fromNow();
'in 4 months'
شما می توانید به صورت اختیاری یک را پاس کنید Boolean
به .fromNow()
به آن بگویید که آیا رشته “ago” (یا “in”) را در قالب بندی لحاظ کند یا خیر. به این ترتیب در صورت نیاز می توانید به راحتی رشته نسبی را سفارشی کنید.
> moment({year: 2016, month: 3, day: 13, hour: 10}).fromNow(true);
'3 months'
زمان از تاریخ
> let may = moment({year: 2016, month: 5, day: 3});
> let october = moment({year: 2016, month: 10, day: 9});
>
> may.from(october);
'5 months ago'
> october.from(may);
'in 5 months'
زمان تا الان
> moment({year: 2016, month: 3, day: 13, hour: 10}).toNow();
'in 3 months'
> moment({year: 2016, month: 9, day: 23, hour: 10}).toNow();
'4 months ago'
زمان تا تاریخ
> let may = moment({year: 2016, month: 5, day: 3});
> let october = moment({year: 2016, month: 10, day: 9});
> may.to(october)
'in 5 months'
>
> october.to(may)
'5 months ago'
ممکن است متوجه شده باشید که هر دو روش “از” و “به” بسته به یکدیگر قابل تعویض هستند روی کدام تاریخ ها در استدلال منتقل می شوند. همش نسبیه
تاریخ-زمان های ساختاریافته
در برخی موارد، ممکن است راحتتر باشد که دادههای تاریخ خود را در قالبی ساختاریافته، احتمالاً برای استفاده در یک الگوریتم یا سریالسازی، داشته باشید. Moment چند راه مختلف برای قالب بندی داده ها در ساختارهای داده ارائه می دهد:
- به روز(): تاریخ لحظه را به صورت جاوا اسکریپت برمی گرداند
Date
- toArray(): داده های تاریخ را به صورت آرایه برمی گرداند –
( 2016, 5, 28, 10, 34, 45, 747 )
- toJSON(): رشته تاریخ ISO تنظیم شده به UTC را برمی گرداند – “2016-06-28T15:34:45.747Z”
- toISOSstring(): رشته تاریخ ISO تنظیم شده به UTC را برمی گرداند – “2016-06-28T15:34:45.747Z”
- toObject(): یک جاوا اسکریپت ساده را برمی گرداند
Object
با داده های تاریخ –{years: 2016, months: 5, date: 28, hours: 10, minutes: 34, seconds: 45, milliseconds: 747}
- toString(): رشته فرمت شده مشابه را برمی گرداند
Date.toString()
– “سه شنبه 28 ژوئن 2016 10:34:45 GMT-0500”
دستکاری تاریخ ها
توانایی دستکاری تاریخ ها نیز برای بسیاری از برنامه ها بسیار مهم است. و این هم به سادگی محاسبات عادی شما نیست – دستکاری تاریخ ها سخت است. آیا می توانید به راحتی این جمع و تفریق تاریخ/زمان را بفهمید؟ برنامه نویسی کار آسانی نیست.
- 21 فوریه + 13 هفته
- 3:14 صبح + 424 دقیقه
- 1 جولای – 1899400140 میلی ثانیه
حالا اگر سال کبیسه باشد چه؟ یا یک سال با یک ثانیه کبیسه? برای شما خوش شانس است، نیازی نیست خودتان این را بفهمید. لحظه از قبل برای شما وجود دارد.
روشهای دستکاری زمان زیادی وجود دارد، بنابراین ما فقط به مواردی که بیشتر استفاده میشوند میپردازیم:
جمع/ تفریق
از یک عدد/رشته یا یک شی برای دستکاری تاریخ استفاده کنید:
> moment().add(7, 'days');
> moment().subtract({days:13, months:3});
زنجیر زدن نیز به خوبی کار می کند:
> moment().add({hours: 7}).subtract(13, 'minutes');
شروع/پایان زمان
این روشهای راحت تاریخ/زمان را به پایان واحد زمان معین تنظیم میکنند. به عنوان مثال، اگر یک تاریخ با ساعت 2:15 دارید، اما نیاز دارید که شروع روز باشد، از این موارد استفاده کنید:
> moment().startOf('day');
با این کار ساعت 12:00 صبح همان روز تنظیم می شود. همان کار برای سال، ماه، ساعت، و بسیاری دیگر.
> moment().endOf('year'); // sets date to 12-31-2016 23:59:59.999
من این را در برنامههای گزارشدهی که کاربران میتوانند بازههای زمانی گزارشها را انتخاب کنند، مانند Google Analytics بسیار مفید است. برای بازیابی اطلاعات صحیح، باید محدوده صحیح را داشته باشید.
مناطق زمانی لحظه ای
Moment از تنظیم فوست های منطقه زمانی خارج از جعبه پشتیبانی می کند، اما اگر به پشتیبانی بهتر منطقه زمانی نیاز دارید، باید از آن استفاده کنید. moment-timezone
.
این کتابخانه به شما امکان میدهد مناطق زمانی را بر اساس شهر، منطقه یا سایر شناسهها مشخص کنید، که میتواند کار را برای برنامههای رو به رو کاربر بسیار سادهتر کند.
برای استفاده از آن با npm و نصب کنید require()
این به جای moment
:
> const moment = require('moment-timezone');
با بیش از 550 شناسه منطقه زمانی، می توانید مشخص کننده های منطقه زمانی خود را بر اساس دسته ها و نام های منطقه ای مختلف تقسیم کنید:
- نام منطقه زمانی: ایالات متحده / مرکزی، ایالات متحده / شرقی، ایالات متحده / کوهستان و غیره
- شهر: آمریکا/شیکاگو، آمریکا/لس_آنجلس، آسیا/دبی، استرالیا/سیدنی و غیره
- افست GMT: Etc/GMT+6، Etc/GMT-2، Etc/GMT0، و غیره
برای فهرست کاملی از شناسههای منطقه زمانی، میتوانید فهرست کاملی از نامها را با اجرای:
> const moment = require('moment-timezone');
> moment.tz.names()
برای استفاده از این شناسه ها برای تنظیم زمان و منطقه زمانی با .tz()
روش:
> moment.tz({year: 2016, month: 6, day: 30, hour: 11}, 'America/Los_Angeles').format();
'2016-07-30T11:00:00-07:00'
> moment.tz({year: 2016, month: 6, day: 30, hour: 11}, 'America/Chicago').format();
'2016-07-30T11:00:00-05:00'
نتیجه
کار برنامه ریزی شده با تاریخ و زمان سخت است، اما لازم نیست سخت ترین کاری باشد که انجام می دهید. Moment یک مثال عالی از کتابخانه ای است که یک موضوع دشوار را با یک API تمیز و آسان برای استفاده بسیار ساده تر می کند.
علاوه بر تجزیه، قالببندی و دستکاری که Moment ارائه میکند، افزودنی نیز وجود دارد.روی پشتیبانی از مناطق زمانی از طریق moment-timezone
بسته بندی با افزودن پشتیبانی بهتر برای مناطق زمانی، زندگی را برای خود و کاربرانتان آسان تر کنید.
از چه ویژگی های دیگری از Moment اغلب استفاده می کنید؟ در نظرات به ما اطلاع دهید!
منتشر شده در 1403-01-28 13:39:04