JavaScriptدر Date
منظور از Date تاریخ و ساعت است که برای استفاده از آن باید یک شی (Object) از Date ایجاد کرد و برای این کار چهار روش وجود دارد:
new Date()
new Date(year, month, day, hours, minutes, seconds, milliseconds)
new Date(milliseconds)
new Date(date string)
new Date
این object تاریخ و ساعت جاری را نمایش میدهد. در مثال پیش رو کد مرتبط همراه با نتیجه آن قابل مشاهده است.
<html> <body> <p id=“demo”></p> <script> const d = new Date(); document.getElementById(“demo”).innerHTML = d; </script> </body> </html>
:نتیجه کد
new Date(year, month, ...)
میتوانیم با استفاده از دستور new Date(year, month, …) نیز تاریخی که مدنظرمان هست را به صورت استاتیک نمایش دهیم.
توجه کنید که داخل پرانتز امکان قرار دادن هفت عدد به عنوان سال, ماه, روز, ساعت, دقیقه, ثانیه و میلی ثانیه وجود دارد که بسته به نیازتان میتوانید از تمام هفت عدد یا برخی از آنها استفاده کنید.
مثال:
<script> const d = new Date(2018, 11, 24, 10, 33, 30, 0); document.getElementById(“demo”).innerHTML = d; </script>
نتیجه کد:
Mon Dec 24 2018 10:33:30 GMT+0330 (Iran Standard Time)
نکته: تمامی تاریخ های نمایش داده شده به صورت میلادی بودند و اگر قصد نمایش تاریخ شمسی را دارید از دستور toLocaleDateString('fa-IR') در انتهای کد مربوط به تاریخ استفاده کنید:
const d = new Date().toLocaleDateString('fa-IR'); document.getElementById("demo").innerHTML = d
نکته: اگر برای مقدار مربوط به سال عددی دو رقمی xx یا یک رقمی x وارد کنید به صورت خودکار به شکل 19xx و 190x نمایش داده میشود.
درجاوااسکریپت Date توابع مربوط به
| توابع | توضیحات |
|---|---|
| getFullYear() | سال را به صورت چهار عدد نمایش میدهد |
| getMonth() | عدد ماه میلادی را نمایش میدهد ولی دقت کنید که مقدار ۰ تا ۱۱ برمیگرداند |
| getDate() | تاریخ روز رو از ۱ تا ۳۱ نمایش میدهد |
| getHours() | ساعت را با اعداد ۰ تا ۲۳ برمیگرداند |
| getMinutes() | مقدار دقیقه را از ۰ تا ۵۹ نشان میدهد |
| getSeconds() | مقدار ثانیه را از ۰ تا ۵۹ برمیگرداند |
| getMilliseconds() | مقدار مربوط به میلی ثانیه از ۰ تا ۹۹۹ نمایش میدهد |
| getDay() | روز هفته را از ۰ تا ۶ نمایش میدهد |
مثال:
در مثال زیر نحوه استفاده از تابع getFullYear نشان داده شده است. برای بررسی نحوه عملکرد سایر توابع نیز میتوانید از ادیتور آنلاین استفاده کنید.
<html> <body> <p id=“demo”></p> <script> const d = new Date(); document.getElementById(“demo”).innerHTML = d.getFullYear(); </script> </body> </html>
setFullYear تابع
در تابع setFullYear یک مقدار را به صورت دستی به سال اختصاص میدهیم. در مثال پیش رو نحوه استفاده از این تابع نشان داده شده است.
<html> <body> <p id=“demo”></p> <script> const d = new Date(); d.setFullYear(2020); document.getElementById(“demo”).innerHTML = d; </script> </body> </html>
در این تابع همچنین میتوانید مقادیر روز و ماه را نیز تعریف کنید:
d.setFullYear(2020, 11, 08);
setMonth تابع
برای تخصیص مقدار ماه میلادی نیز میتوانید از این تابع استفاده کنید.
مثال:
<html> <body> <p id=“demo”></p> <script> const d = new Date(); d.setMonth(11); document.getElementById(“demo”).innerHTML = d; </script> </body> </html>
setDate تابع
در این مورد نیز میتوانیم یک عدد در بازه ۱ تا ۳۱ به عنوان یک روز ماه به تاریخی که قرار است نمایش داده شود اختصاص دهیم.
مثال:
<html> <body> <p id=“demo”></p> <script> const d = new Date(); d.setDate(15); document.getElementById(“demo”).innerHTML = d; </script> </body> </html>
ممکن است بخواهید تاریخ یک روز مشخص در گذشته یا آینده را نمایش دهید مثلا ۵۰ روز بعد یا ۵۰ روز قبل در اینصورت نیز میشود با ترکیب توابع seDate و getDate تاریخ موردنظر را نمایش داد:
<html> <body> <p id=“demo”></p> <script> const d = new Date(); d.setDate(d.getDate() + 50); document.getElementById(“demo”).innerHTML = d; </script> </body> </html>
setHours, setMinutes, setSeconds توابع
این سه تابع با توجه به نامشان به ترتیب برای تخصیص ثانیه (۰ تا ۵۹), دقیقه (۰ تا ۵۹) و ساعت (۰ تا ۲۳) به کار میروند.
- مثال استفاده از setHours جهت تخصیص ساعت:
<html> <body> <p id=“demo”></p> <script> const d = new Date(); d.setHours(22); document.getElementById(“demo”).innerHTML = d; </script> </body> </html>
- مثال استفاده از setMinutes جهت تخصیص دقیقه:
<html> <body> <p id=“demo”></p> <script> const d = new Date(); d.setMinutes(30); document.getElementById(“demo”).innerHTML = d; </script> </body> </html>
- مثال استفاده از تابع setSeconds برای تخصیص ثانیه:
<html> <body> <p id=“demo”></p> <script> const d = new Date(); d.setSeconds(30); document.getElementById(“demo”).innerHTML = d; </script> </body> </html>