كيفية الحصول على التاريخ الحالي في JavaScript: شرح كامل للمبتدئين

كيفية الحصول على التاريخ الحالي في JavaScript: شرح سؤال شائع من Stack Overflow

إذا كنت قد بدأت للتو رحلتك في تطوير الويب، فستواجه عاجلاً أم آجلاً مهمة: عرض التاريخ الحالي على الصفحة. قد يبدو الأمر بسيطاً، ولكن كما تظهر إحصائيات Stack Overflow، فإن السؤال "How do I get the current date in JavaScript?" يحصل على آلاف المشاهدات كل شهر. لماذا؟ لأن وراء الصياغة البسيطة تكمن طبقة كاملة من التفاصيل الدقيقة: من تنسيقات الإخراج إلى التعامل مع المناطق الزمنية.

في هذه المقالة، لن نقدم لك كوداً جاهزاً فحسب. بل سنقوم بتحليله بالتفصيل، ونتعلم كيفية التحكم في التنسيقات، ونتجنب الأخطاء النموذجية التي يقع فيها المبتدئون. هيا بنا!

تعرف على: كائن Date - أداتك الرئيسية

في JavaScript، لا يوجد أمر خاص "أظهر اليوم". بدلاً من ذلك، تقدم اللغة كائن Date القوي، ولكنه أحياناً ماكر. للحصول على اللحظة الزمنية الحالية، يكفي إنشاء مثيل جديد بدون وسائط:

const now = new Date();console.log(now); // الإخراج: Tue Oct 15 2024 14:30:00 GMT+0300

بهذه البساطة! لكن دعنا نرى ما حصلنا عليه بالفعل. في وحدة التحكم، سترى شيئاً مثل Tue Oct 15 2024 14:30:00 GMT+0300. هذا تنسيق قابل للقراءة البشرية، لكنه لا يناسب دائماً المهام الحقيقية. تخيل أنك تبني متجراً إلكترونياً وتريد عرض تاريخ الطلب كـ "15.10.2024" - هذا الإخراج "الأصلي" غير مناسب.

الأمر أن كائن Date يخزن الميلي ثانية المنقضية منذ 1 يناير 1970 (عصر Unix). وما نراه في وحدة التحكم هو نتيجة تحويل ضمني إلى سلسلة نصية. للتحكم في التنسيق، تحتاج إلى استخدام طرق الكائن.

طرق استخراج مكونات التاريخ

تخيل أن التاريخ هو بيتزا يجب تقطيعها إلى قطع: السنة، الشهر، اليوم، الساعات، الدقائق، الثواني. كائن Date لديه "سكاكين" خاصة - طرق لكل قطعة.

إليك أشهرها:

• getFullYear() - يعيد السنة (مثال: 2024).
• getMonth() - يعيد الشهر من 0 إلى 11. تنبيه: يناير هو 0، ديسمبر هو 11. هذا فخ شائع!
• getDate() - يعيد يوم الشهر (1-31).
• getDay() - يعيد يوم الأسبوع من 0 (الأحد) إلى 6 (السبت).
• getHours()، getMinutes()، getSeconds() - بوضوح، الساعات، الدقائق، الثواني.

لنجمع منها تاريخنا الخاص:

const now = new Date();const year = now.getFullYear();const month = now.getMonth() + 1; // +1 لأن يناير = 0const day = now.getDate();const hours = now.getHours();const minutes = now.getMinutes();

console.log(`${day}.${month}.${year} ${hours}:${minutes}`);// الإخراج: "15.10.2024 14:30"

لاحظ: أضفنا +1 إلى الشهر. هذا خطأ كلاسيكي للمبتدئين - نسيان الترقيم من الصفر. تذكر مرة واحدة وإلى الأبد: getMonth() يعيد 0 لشهر يناير.

إخراج جميل: تنسيق التاريخ

التجميع اليدوي للسلسلة النصية جيد للفهم، ولكن هناك طرق أكثر أناقة. تقدم JavaScript عدة طرق مدمجة للتنسيق:

1. toLocaleDateString() - للإخراج المترجم

هذه الطريقة تتكيف مع الإعدادات الإقليمية. تريد بالعربية؟ تفضل:

const now = new Date();console.log(now.toLocaleDateString('ar-SA')); // "١٥/١٠/٢٠٢٤"console.log(now.toLocaleDateString('en-US')); // "10/15/2024"console.log(now.toLocaleDateString('de-DE')); // "15.10.2024"

يمكنك حتى تخصيص التنسيق حسب احتياجاتك، عن طريق تمرير كائن مع خيارات:

const options = {  year: 'numeric',  month: 'long',  day: 'numeric',  weekday: 'long'};console.log(now.toLocaleDate