دوشنبه ۰۷ خرداد ۱۴۰۳

Monday, May 27, 2024 GMT +3:30

کار با تاریخ و زمان در جاوا اسکریپت (JavaScript)

javascript-date-time

تاریخ و زمان، از جمله مباحث پرکاربرد و چالش های همیشگی در زبان های برنامه نویسی و به طور خاص در برنامه نویسی وب (php، asp، javascript و...) است، به خصوص برای کسانی که از تاریخی به جزء تاریخ میلادی استفاده می کنند (مانند ما کاربران فارسی زبان)، مشکل از این نیز پیچیده تر می شود، چرا که ناچاریم تاریخ میلادی را به شمسی تبدیل کنیم که خود به محاسبات دقیق و پیچیده نیاز دارد، از طرفی همان طور که پیش از این گفته ایم، جاوا اسکریپت یک زبان سمت کاربر (Client-side) است، بدین معنی که کدهای شما تنها در مرورگر کاربران قابل اجرا است و لذا تنظیمات آن نیز به مرورگر و به تبع به سیستم عامل کاربر وابسته است (که خود معایب و مزایایی دارد)، به هر صورت آشنایی با نحوه کار توابع مربوط به تاریخ و زمان در جاوا اسکریپت، جهت تسلط بیشتر بر این زبان، جزء جدایی ناپذیر از آموزش های مقدماتی است و لذا در این مطلب می خواهیم به آن بپردازیم.

توابع نمایش تاریخ و زمان در جاوا اسکریپت


برای نمایش یک تاریخ در جاوا اسکریپت ابتدا باید یک شی (object) با استفاده از Date در کد خود ایجاد کنیم (این شی به صورت از پیش تعریف شده یا built-in در مفسر جاوا اسکریپت وجود دارد)، به طور مثال:
<script type="text/javascript">
var now =  new Date();
alert(now);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
Sun Jan 20 2013 13:45:58 GMT+0330 (Iran Standard Time)
اکنون متغیر فرضی now می تواند از توابع نمونه و از پیش تعریف شده شی Date استفاده کند، تعداد و کاربرد این توابع متنوع است که در زیر به اختصار به مهم ترین آنها اشاره می کنیم.

تابع getdate


از تابع getdate برای بدست آوردن روز به صورت عددی (بین 1 تا 31) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var day = now.getDate();
alert(day);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
20

تابع getDay


از تابع getDay برای بدست آوردن روز معین از روزهای هفته به صورت عددی (بین 0 تا 6) کاربرد دارد، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var day = now.getDay();
alert(day);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
0

تابع getFullYear


از تابع getFullYear برای بدست آوردن سال های میلادی به صورت عدد چهار رقمی استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var full_year = now.getFullYear();
alert(full_year);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
2013

تابع getHours


از تابع getHours برای بدست آوردن ساعت فعلی سیستم (به صورت عدد دو رقمی) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var hour = now.getHours();
alert(hour);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
13

تابع getMilliseconds


از تابع getMilliseconds برای بدست آوردن هزارم ثانیه از زمان فعلی (زمان موجود در شی Date) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var millisecond = now.getMilliseconds();
alert(millisecond);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
937

تابع getMinutes


از تابع getMinutes برای بدست آوردن دقیقه (بین عدد 1 تا 60) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var minute = now.getMinutes();
alert(minute);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
45

تابع getMonth


از تابع getMonth برای بدست آوردن ماه (بین اعداد 0 تا 11) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var month = now.getMonth();
alert(month);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
0

تابع getSeconds


از تابع getSeconds برای بدست آوردن ثانیه (بین 0 تا 60) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var second = now.getSeconds();
alert(second);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
58

تابع getTime


از تابع getTime برای بدست آوردن مدت زمان به میلی ثانیه از نیمه شب اول ژانويه سال 1970 میلادی استفاده می شود (این عدد یک تاریخ قراردادی تعریف شده در Unix time است، در واقع این زمان مشخص کننده مدت میلی ثانیه سپری شده از شروع ساعت هماهنگ جهانی یا  Coordinated Universal Time (به اختصار  UTC یا POSIX) است، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var since_1970 = now.getTime();
alert(since_1970);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
1358681328943

تابع getTimezoneOffset


از تابع getTimezoneOffset برای بدست آوردن اختلاف زمانی به دقیقه از GMT استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
var time_zone = now.getTimezoneOffset();
alert(time_zone);
</script>
خروجی کد بالا به صورت نمونه زیر خواهد بود.
-210
نکته 1: خروجی تابع getTimezoneOffset برای زمان های محلی که اختلاف آنها نسبت به GMT مثبت باشد (مانند 3:30 برای ایران)، عدد منفی خواهد بود و بالعکس برای زمان های محلی که اختلاف آنها نسب به GMT منفی باشد، عدد مثبت خواهد بود.
نکته 2: توابعی که در بالا بررسی کردیم، به صورت استاندارد UTC یا ساعت هماهنگ جهانی نیز قابل استفاده هستند، لذا اگر ساعت محلی سیستم عامل با ساعت UTC برابر نباشد (اختلاف زمانی وجود داشته باشد)، استفاده یا عدم استفاده از UTC نیز نتیجه متفاوت خواهد داشت (در صورت استفاده، زمان دریافتی بر اساس استاندار UTC خواهد بود نه الزاما زمان سیستم عامل).

توابع تنظیم تاریخ و زمان در جاوا اسکریپت


در کنار توابعی که برای نمایش تاریخ و زمان در جاوا اسکریپت وجود دارد، می توان از سری دیگری از توابع هم خانوده آنها جهت اعمال تغییرات در تاریخ و زمان استفاده کرد، این توابع که با عبارت set شروع می شوند را در ادامه برسی می کنیم.

تابع setDate


از تابع setDate برای تغییر روز (بین 1 تا 31) از تاریخ مورد نظر استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
now.setDate(22);
day = now.getDate();
alert(day);
</script>
خروجی کد بالا به صورت زیر خواهد بود.
22

تابع setFullYear


از تابع setFullYear برای تنظیم سال به صورت عدد چهار رقمی استفاده می شود، به طورر مثال:
<script type="text/javascript">
var now =  new Date();
now.setFullYear(2000);
full_year = now.getFullYear();
alert(full_year);
</script>
خروجی کد بالا به صورت زیر خواهد بود.
2000

تابع setHours


از تابع setHours برای تنظیم ساعت (بین 0 تا 23) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
now.setHours(14);
hour = now.getHours();
alert(hour);
</script>
خروجی کد بالا به صورت زیر خواهد بود.
14

تابع setMilliseconds


از تابع setMilliseconds برای تنظیم زمان به هزارم ثانیه (بین 0 تا 999) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
now.setMilliseconds(556);
millisecond = now.getMilliseconds();
alert(millisecond);
</script>
خروجی کد بالا به صورت زیر خواهد بود.
556

تابع setMinutes


از تابع setMinutes برای تنظیم دقیقه (بین عدد 1 تا 60) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
now.setMinutes(23);
minute = now.getMinutes();
alert(minute);
</script>
خروجی کد بالا به شکل زیر خواهد بود.
23

تابع setMonth


از تابع setMonth برای تنظیم یک ماه (بین اعداد 0 تا 11) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
now.setMonth(0);
month = now.getMonth();
alert(month);
</script>
خروجی کد بالا به صورت زیر خواهد بود.
0

تابع setSeconds


از تابع setSeconds برای تنظیم زمان به ثانیه (بین اعداد 0 تا 60) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
now.setSeconds(33);
second = now.getSeconds();
alert(second);
</script>
خروجی کد بالا به صورت زیر خواهد بود.
33

تابع setTime


از تابع setTime برای تنظیم زمان به صورت میلی ثانیه از نیمه شب اول ژانويه سال 1970 میلادی (زمان به صورت Unix) استفاده می شود، به طور مثال:
<script type="text/javascript">
var now =  new Date();
now.setTime(1358681325766);
time = now.getTime();
alert(time);
</script>
خروجی کد بالا به صورت زیر خواهد بود.
1358681325766
نکته: به جزء تابع setTime، سایر توابع مربوط به set بر اساس استاندارد UTC نیز قابل استفاده هستند.

نمایش تاریخ و زمان به صورت فرمت بندی شده در جاوا اسکریپت


در پایان این آموزش بد نیست نگاهی داشته باشیم به توابع مربوط به فرمت بندی و نمایش تاریخ و زمان در جاوا اسکریپت، البته همان طور که پیش از این عنوان شد، این توابع از پیش تعریف شده منطبق با تاریخ میلادی هستند و لذا برای سایر موارد باید کلاس ها و توابعی مجزا و مستقل نوشت، به هر صورت لیستی از این توابع و نمونه خروجی آنها را در زیر ملاحظه می کنید.
تابع toDateString - نمونه خروجی: Thu Jan 24 2013
تابع toLocaleDateString - نمونه خروجی: Thursday, January 24, 2013
تابع toLocaleFormat - نمونه خروجی: Thursday, January 24, 2013 10:01:15 PM
تابع toLocaleString - نمونه خروجی: Thursday, January 24, 2013 10:02:12 PM
تابع toLocaleTimeString - نمونه خروجی: 10:03:56 PM
تابع toString - نمونه خروجی: Thu Jan 24 2013 22:16:49 GMT+0330 Iran Standard Time
تابع toTimeString - نمونه خروجی: 22:18:04 GMT+0330 Iran Standard Time

مثال و پیش نمایش آنلاین


در زیر می توانید مثالی از کاربرد تاریخ و زمان در جاوا اسکریپت و پیش آنلاین آن را ملاحظه و بررسی نمائید.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>وبگو | date و time در جاوا اسکریپت</title>
<!-- https://webgoo.ir -->
<style type="text/css">
body{
    font-family:Tahoma, Geneva, sans-serif;
    font-size:12px;
    direction:rtl;
}
#date{
    direction:ltr;
}
</style>
<script type="text/javascript">
function RefreshDate(){
    var refresh_date = setTimeout('ShowDate();', 1000);
}
function ShowDate(){
    var now =  new Date();
    var show = document.getElementById('date').innerHTML = now;
    var refresh_date = RefreshDate();
}
</script>
</head>
<body onload="ShowDate();">
<noscript>جاوا اسکریپت در مرورگر شما غیرفعال است یا پشتیبانی نمی شود.</noscript>
<div id="date"></div>
<hr>
با استفاده از Date و setTimeout می توان تاریخ و زمان را به صورت داینامیک نمایش داد.
</body>
</html>
پیش نمایش
دسته بندی: آموزش مقدماتی » JavaScript
related مطالب بیشتر:
دستور switch و case در جاوا اسکریپت (JavaScript)
توابع (Functions) در جاوا اسکریپت (JavaScript)
تعریف و استفاده از متغیر (Variable) در جاوا اسکریپت (JavaScript)
رویدادها (Events) در جاوا اسکریپت (JavaScript)
متدهای کار با آرایه در جاوا اسکریپت (JavaScript)
دیدگاه
more ۶۲ دیدگاه برای این مطلب ارسال شده است.
more دیدگاه جدید بر اساس تاریخ ارسال در انتهای دیدگاه های موجود نمایش داده می شود.
بهاره هوشمندی
۰۰:۳۹ ۱۴۰۲/۰۸/۰۹
با تشکر از شما استاد گرامی
پس کد رو باید اینطوری وارد کنم؟
حذف شد
اینطوری واسه من کار می کنه
سپاسگزارم از شما
خیلی بهم کمک کردید
خدا پشت و پناهتون باشه
بله ظاهرا که مشکلی ندارد، سلامت باشید.
محمد
۲۱:۵۵ ۱۴۰۲/۱۱/۲۳
سلام من گوشی نوکیای جاوا دارم که ساعت گویاش فعال شده و به صورت انگلیسی ساعت رو میگه میخواستم ببینم چطور میشه ساعت گویاش رو غیر فعال کنم؟
بسته به مدل گوشی باید از منو وارد تنظیمات ساعت شوید و Speaking clock را غیر فعال کنید.
more لطفا پیش از ارسال دیدگاه نکات زیر را مد نظر داشته باشید:
- به سوالات کلی، زمانبر، مبهم و مشکلاتی که تلاشی برای رفع آنها نکرده باشید پاسخ مختصر داده شده یا به بخش برنامه نویسی اختصاصی ارجاع داده می شوند.
- کدها و اسکریپت های طولانی را ترجیحا در یک صفحه وب آنلاین یا به صورت حساب موقت و آزمایشی قرار دهید تا امکان بررسی دقیق مشکل و خطایابی میسر باشد.
- تمام دیدگاه های ارسالی خوانده شده و برای هر کاربر مدت زمان لازم جهت پاسخگویی در نظر گرفته می شود، لطفا از طرح سوالات متعدد در بازه زمانی کوتاه خودداری کنید.



 refresh
10 × 10
3 × 6
20 × 20
=
آخرین دیدگاه ها
more برای دسترسی سریع به یادداشت مربوطه می توانید از لینک مطلب در کادر زیر استفاده کنید.
پرتو
سلام خوبید؟ بلاکفا باز دچار مشکل شده یا فقط برای من دچار مشکل شده؟ منظورم اینکه خیلی دیر باز میشه و فقط برای فایرفاکس هم...
۱۴۰۳/۰۳/۰۱

سعیدی
سلام می تونید اینو اصلاح کنید؟ چون من با توضیحات شما یاد نگرفتم خیلی ممنون اگه یکبار اصلاح کنید واسه بعد یاد...
۱۴۰۳/۰۲/۲۲

سعیدی
دست شما درد نکنه وقتی اینطوری تغییر میدم و به class می نویسم کار نمی کنه و ارور میده
۱۴۰۳/۰۲/۲۱

سعیدی
دست شما درد نکنه خیلی خوب بود این یکی رو چطوری فراخوانی کنم؟ این واسه مناسبت هاست خیلی ممنون
۱۴۰۳/۰۲/۱۹

سعیدی
با سلام آیا می شه این تابع رو بصورت class نوشت؟ میخوام وقتی کد ملی میدم با این تابع فراخوانی بشه و شهر...
۱۴۰۳/۰۲/۱۹

پرتو
مگه شما دارین اموزشش رو؟ آدرسش رو میزارید؟ یا اگر سایتی رو میشناسید که آموزش داده باشه معرفی کنید ممنون میشم من خیلی گشتم توی...
۱۴۰۳/۰۲/۱۸

پــرتو
سلام خوبید ؟ خسته نباشید گوشی پدرم شیاومی هست ایمیلمو ثبت کردم داخلش بعد می خواستم حذفش کنم نمیشد می گفت همه داده های توی...
۱۴۰۳/۰۲/۱۶

vip
خیلی ممنونم از شما خیلی عالی شد میشه مثل تبلیغ بلاگفا باشه یعنی زیر صفحه نمایش داده بشه و صفحه رو سیاه نکنه که تا...
۱۴۰۳/۰۲/۰۵

vip
با سلام و خسته نباشید استاد چند وقت پیش این کد رو از شما گرفتم این کد خیلی خوبه و کاربر رو هم...
۱۴۰۳/۰۲/۰۴

پـــرتو
سلام خسته نباشید شرمنده مزاحم میشم یه سوال داشتم می خواستم بپرسم که چرا بلاگفا باز نمیشه برام؟ کلا هر وبلاگی که مربوط به بلاگفا...
۱۴۰۳/۰۲/۰۲

هادی عبداله زاده
با تشکر از شما دوست عزیز با order_id درستش کردم موقع برگشت order_id رو بر می گردونه اینطوری کردم که از طریق اون شناسه...
۱۴۰۳/۰۱/۲۲

هادی عبداله زاده
با تشکر از شما برای ارسال درخواست درست بود و به بانک هم وصل شد فقط برای وریفای چیکارش کنم؟
۱۴۰۳/۰۱/۲۲

هادی عبداله زاده
با سلام و خسته نباشید سال نو شما مبارک من یه کد واسه انتقال به درگاه دارم واسه زرین پال هست ...
۱۴۰۳/۰۱/۲۰

پـــرتو
ببخشید ممنون از جوابتون ولی یه سوال اگر بخوام همون شماره رو با حساب کاربری جدید با همون شماره رو داشته باشم داده های قبلی...
۱۴۰۳/۰۱/۱۹

حسین بلاگ
من یه صفحه ارسال متن دارم میخوام کاربرها وقتی واسه م پیام میدن وقتی روی اون دکمه کلیک می کنن بهشون بگه لطفا صبر...
۱۴۰۳/۰۱/۱۹

شریفی
سلام و عرض احترام سال نو رو بهتون تبریک میگم انشالله سال خوبی داشته باشین یه سرویس وبلاگدهی داریم که قصد داریم به...
۱۴۰۳/۰۱/۱۵

فرهادی
سلام ببخشید یه مشکل دارم این صفحه رو نگاه کنید چند بار توی سورس تکرار شده نمی تونم الگوی توضیحاتش رو استخراج...
۱۴۰۳/۰۱/۱۰
  در انتظار بررسی: ۰
 پاسخگویی به سوالات ممکن است تا ۲۴ ساعت زمان ببرد.