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

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

استفاده از آبجکت Date

آبجکت Date یک شی از قبل ساخته شده از جاوا اسکریپت است که به اجازه دسترسی به زمان محلی کاربر با دسترسی به ساعت سیستم از طریق مرورگر را می دهد.

شی Date همچنین چندین متد برای مدیریت, دستکاری و فرمت بندی ساعت تاریخ و زمان در جاوا اسکریپت را می دهد.

ساخت یک شی Date

قبل از شروع کار با تاریخ و زمان در جاوا اسکریپت, نیاز است که یک آبجکت Date بسازیم منظور از ساختن شی ایجاد یک نمونه از کلاس اصلی تعریف شده در هسته جاوا اسکریپت است.

چهار راه مختلف برای ساخت یک شی Date در جاوا اسکریپت وجود دارد.

سینتکس new Date()

به سادگی می توانید یک آبجکت Date را بدون مقدار خاصی اجرا کنید. در اینجا مقدار تاریخ و زمان همان مقدار تاریخ و زمان دیوایس کاربر که این اسکریپت روی آن اجرا می شود, خواهد بود.

var d = new Date();
document.write(d);

1 2	var d = new Date(); document.write(d);

سینتکس new Date(year, month, …)

می توانید یک آبجکت Date را با پاس دادن پارامترهای جداگانه زیر اجرا کنید :

year, month, day, hours, minutes, seconds, milliseconds

پارامتر year‌سال و monthماه ضروری و دیگر پارامترها اختیاری است.

var d = new Date(2018,0,31,14,35,20,50);
document.write(d);

1 2	var d = new Date(2018,0,31,14,35,20,50); document.write(d);

سینتکس new Date(dateString)

جاوا اسکریپت همچنین به شما اجازه ساخت یک آبجکت Date با پاس دادن یک رشته نمایانگر تاریخ یا تاریخ و زمان باهمدیگر را همانند مثال زیر را می دهد.

var d = new Date("31 January 2018");
document.write(d);

1 2	var d = new Date("31 January 2018"); document.write(d);

همچنین می توانستید رشته را بصورت Jan 31 2018 یا هر عدد معتبر دیگر وارد کنید و جاوا اسکریپت به راحتی آن را هندل می کند.

سینتکس new Date(milliseconds)

شما می توانید یک آبجکت Date را با پاس دادن اعداد به میلی ثانیه از تاریخ ۱ ژانویه ۱۹۷۰ ساعت ۰۰:۰۰:۰۰ GMT تعریف کنید.

این زمان به نام دوره یونیکس نامیده می شود که از سال ۱۹۷۰ سیستم عامل یونیکس بصورت رسمی معرفی شد.

var d = new Date(1517356800000);
document.write(d);

1 2	var d = new Date(1517356800000); document.write(d);

زمان بالا نشان دهنده پنشجنبه ۳۱ ژانویه ۲۰۱۸ ساعت ۰۵:۳۰:۰۰ GMT+0530 است.

همین که یک نمونه از آبجکت Date را ساختید می توانید عملیات مختلفی با متدهای آن انجام بدید مثل دریافت کامپوننت های مختلف تاریخ, ست کردن یا ویرایش مقادیر تاریخ و زمان.

نکته: جاوا اسکریپت میانبرهایی به نام “literals” برای ساخت بیشتر آبجکت های محلی بدون استفاده از اپراتور new معرفی کرده است مثل new Object(), new Array() و غیره..

دریافت تاریخ زمان فعلی

برای دریافت تاریخ و زمان فعلی کافی است که یک آبجکت Date‌ بدون پاس دادن پارامتری بسازید.

var now = new Date();
alert(now); // Display the current date and time

1 2	var now = new Date(); alert(now); // Display the current date and time

خروجی این مثال موردی شبیه به این خواهد بود :

Thu Feb 14 2019 07:50:52 GMT+0330 (Iran Standard Time)

ساخت رشته تاریخ و زمان

آبجکت Date در جاوا اسکریپت شامل چندین متد مختلف مثل toDateString(), toLocaleDateString() و .. است که برای ایجاد رشته های تاریخ در فرمت های مختلف استفاده می شود.

var d = new Date();
alert(d.toDateString()); // Display an abbreviated date string
alert(d.toLocaleDateString()); // Display a localized date string
alert(d.toISOString()); // Display the ISO standardized date string
alert(d.toUTCString()); // Display a date string converted to UTC time

var d = new Date();

alert(d.toDateString()); // Display an abbreviated date string

alert(d.toLocaleDateString()); // Display a localized date string

alert(d.toISOString()); // Display the ISO standardized date string

alert(d.toUTCString()); // Display a date string converted to UTC time

مشابه آن می توانید از متد های toLocaleTimeString(), toTimeString() برای ایجاد رشته زمان استفاده کنید.

var d = new Date();
alert(d.toTimeString()); // Display the time portion of the date
alert(d.toLocaleTimeString()); // Display a localized time string

var d = new Date();

alert(d.toTimeString()); // Display the time portion of the date

alert(d.toLocaleTimeString()); // Display a localized time string

دریافت کامپوننت خاص از تاریخ و زمان

همین که یک آبجکت date مناسب داشته باشید تعدادی متد برای استخراج جزییات از آن مثل ماه, تاریخ, ساعات یا دقایق و غیره… در اختیار خواهید داشت.

این بخش متدهای مختلفی برای استخراج اطلاعات از آبجکت Date را خدمت شما معرفی می کند.

دریافت سال, ماه و تاریخ

آبجکت Date متدهای زیادی مثل getFullYear(), getMonth(), getDay() و .. را در اختیار شما قرار می دهد. که می توانید برای دریافت بخش های مختلف مثل ماه, هقفته, روز و غیره.. استفاده کنید.

var d = new Date();
// Extracting date part
alert(d.getDate()); // Display the day of the month
alert(d.getDay()); // Display the number of days into the week (0-6)
alert(d.getMonth()); // Display the number of months into the year (0-11)
alert(d.getFullYear()); // Display the full year (four digits)

var d = new Date();

// Extracting date part

alert(d.getDate()); // Display the day of the month

alert(d.getDay()); // Display the number of days into the week (0-6)

alert(d.getMonth()); // Display the number of months into the year (0-11)

alert(d.getFullYear()); // Display the full year (four digits)

متد getDay() یک عدد نمایانگر روزهای هفته (۰ تا ۶) را به جای نام آنها را برگشت می دهد.

مثل همان, متد getMonth() شماره ماه از سال (۰ تا ۱۱) را به جای نام ماه برگشت می دهد.

دریافت ساعت, دقیقه, ثانیه و میلی ثانیه

مشابه آن, آبجکت Date متدهایی مثل getHours(), getMinutes(), getSeconds(), getTimezoneOffset() و غیره را برای استخراج ساعت از آبجکت Date را در اختیار ما قرار می دهد.

var d = new Date();
// Extracting time part 
alert(d.getHours()); // Display the number of hours into the day (0-23)
alert(d.getMinutes()); // Display the number of minutes into the hour (0-59)
alert(d.getSeconds()); // Display the seconds into the minute (0-59)
alert(d.getMilliseconds()); // Display the number of milliseconds into second (0-999)
alert(d.getTime()); // Display the number of milliseconds since 1/1/1970
alert(d.getTimezoneOffset()); // Display the time-zone offset (from Greenwich Mean Time) in minutes

var d = new Date();

// Extracting time part

alert(d.getHours()); // Display the number of hours into the day (0-23)

alert(d.getMinutes()); // Display the number of minutes into the hour (0-59)

alert(d.getSeconds()); // Display the seconds into the minute (0-59)

alert(d.getMilliseconds()); // Display the number of milliseconds into second (0-999)

alert(d.getTime()); // Display the number of milliseconds since 1/1/1970

alert(d.getTimezoneOffset()); // Display the time-zone offset (from Greenwich Mean Time) in minutes

ست کردن مقادیر تاریخ و زمان

علاوه بر دریافت مقادیر تاریخ و زمان, می توانید مقادیر را ست یا ویرایش کنید.

ست کردن سال, ماه و تاریخ

آبجکت Date متدهایی مثل setFullYear(), setMonth(),setDate() را برای جایگزین کردن تاریخ در اختیار ما قرار می دهد.

برای مثال, می توانید از متد setFullYear() برای تغییر تاریخ فعلی ذخیره شده در متغییر استفاده کنید.

var d = new Date();
d.setFullYear(d.getFullYear() + 2);
alert(d); // Display future date

var d = new Date();

d.setFullYear(d.getFullYear() + 2);

alert(d); // Display future date

می توانید این کار را برای تغییر ماه با متد setMonth() انجام بدید.

var d = new Date(); // Current date and time
d.setMonth(0); // Sets month to 0, January
document.write(d);

var d = new Date(); // Current date and time

d.setMonth(0); // Sets month to 0, January

document.write(d);

متد setMonth() یک مقدار عددی از ۰ تا ۱۱ را می پذیرد. اگر مقدار بیشتر از ۱۱ باشد, مقدار سال آبجکت date افزایش می یابد.

var d = new Date(2018, 5, 24); // June 24, 2018
d.setMonth(12); // Sets month to 12, new date will be January 24, 2019
document.write(d);

var d = new Date(2018, 5, 24); // June 24, 2018

d.setMonth(12); // Sets month to 12, new date will be January 24, 2019

document.write(d);

می توانید بخش تاریخ از آبجکت Date‌ را به اینصورت تغییر بدید؛

var d = new Date(2018, 5, 24); // June 24, 2018
d.setDate(15); // Sets date to 15, new date will be June 15, 2018
document.write(d);

var d = new Date(2018, 5, 24); // June 24, 2018

d.setDate(15); // Sets date to 15, new date will be June 15, 2018

document.write(d);

متد setDate() یک مقدار عددی از۱ تا ۳۱ را می پذیرد. اگر مقداری بالاتر از تعداد ماه را وارد کنید, مقدار ماه افزایش می یابد.

var d = new Date(2018, 5, 24); // June 24, 2018
d.setDate(36); // Sets day to 36, new date will be July 6, 2018
document.write(d);

var d = new Date(2018, 5, 24); // June 24, 2018

d.setDate(36); // Sets day to 36, new date will be July 6, 2018

document.write(d);

ست کردن ساعت, دقیقه و ثانیه

متدهایی برای ست کردن مقادیر زمان نیز بسیار مشخص هستند. مثل setHours(), setMinutes(), setSeconds(), setMilliseconds()

هر یک از این متدها مقادیر عددی را بصورت پارامتر دریافت می کنند. محدوده ساعت ۰ تا ۲۳ , دقایق و ثانیه ها ۰ تا ۵۹ و میلی ثانیه ۰ تا ۹۹۹ است.

var d = new Date(2018, 5, 24); // June 24, 2018 00:00:00
d.setHours(8);
d.setMinutes(30);
d.setSeconds(45);
d.setMilliseconds(600);
document.write(d);

var d = new Date(2018, 5, 24); // June 24, 2018 00:00:00

d.setHours(8);

d.setMinutes(30);

d.setSeconds(45);

d.setMilliseconds(600);

document.write(d);

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

هر سوالی داشتید ، از قسمت نظرات ارسال کنید . سریعا ، پاسخگوی سوالات شما هستیم .

موفق باشید.

لغو پاسخ

فاطمه ۲۱ تیر ۱۳۹۹

با جاوااسکریپت میشه تقویم درست کرد

پاسخ

حسن شفیعی ۲۱ تیر ۱۳۹۹

سلام. بله میشه.
نمونه تقویم ساخته شده با جاواسکریپت :
https://fullcalendar.io

نمونه ساخته شده با جی کوئری :
https://netparadis.com/jquery-datepicker

موفق باشید.

پاسخ

فاطمه ۲۱ تیر ۱۳۹۹

بسیار عالی ممنون

پاسخ

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

استفاده از آبجکت Date

ساخت یک شی Date

سینتکس new Date()

سینتکس new Date(year, month, …)

سینتکس new Date(dateString)

سینتکس new Date(milliseconds)

دریافت تاریخ زمان فعلی

ساخت رشته تاریخ و زمان

دریافت کامپوننت خاص از تاریخ و زمان

دریافت سال, ماه و تاریخ

دریافت ساعت, دقیقه, ثانیه و میلی ثانیه

ست کردن مقادیر تاریخ و زمان

ست کردن سال, ماه و تاریخ

ست کردن ساعت, دقیقه و ثانیه

لغو پاسخ

دوره آموزش ساخت دیجی کالا با php به همراه اپلیکیشن اندروید

آموزش ساخت ربات تلگرام با PHP (از پایه و پروژه محور)

دوره جامع آموزش طراحی سایت + پروژه قالب فروشگاه