كائن Date في JavaScript: قراءة التاريخ والوقت، التنسيق، وحساب الفروقات

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

في هذا الدرس ستتعلم: قراءة أجزاء التاريخ، التنسيق، وأشهر الأخطاء التي يقع فيها المبتدئون.

1) إنشاء تاريخ جديد

const now = new Date();
console.log(now);

ماذا يفعل هذا الكود؟ ينشئ كائن تاريخ يمثل اللحظة الحالية.

النتيجة المتوقعة: يظهر تاريخ ووقت جهاز المستخدم الحالي.

خطأ شائع: توقع نفس النتيجة لكل المستخدمين رغم اختلاف المنطقة الزمنية.

2) استخراج أجزاء التاريخ

const now = new Date();

console.log(now.getFullYear()); // السنة
console.log(now.getMonth());    // الشهر (0-11)
console.log(now.getDate());     // يوم الشهر (1-31)
console.log(now.getDay());      // يوم الأسبوع (0-6)

ماذا يفعل هذا الكود؟ يقرأ كل جزء من التاريخ بشكل منفصل.

النتيجة المتوقعة: أرقام يمكن استخدامها في التنسيق أو المقارنات.

خطأ شائع: نسيان أن getMonth() يبدأ من 0.

3) إنشاء تاريخ مخصص

const launchDate = new Date(2026, 2, 15); // 15 مارس 2026
console.log(launchDate);

ماذا يفعل هذا الكود؟ ينشئ تاريخاً محدداً من سنة/شهر/يوم.

النتيجة المتوقعة: تاريخ ثابت يمكن مقارنته مع تاريخ اليوم.

خطأ شائع: كتابة الشهر 3 مع توقع مارس، فيكون الناتج أبريل.

4) تنسيق تاريخ بسيط للعرض

const now = new Date();
const day = now.getDate();
const month = now.getMonth() + 1;
const year = now.getFullYear();

const formatted = `${day}/${month}/${year}`;
console.log(formatted);

ماذا يفعل هذا الكود؟ يبني صيغة تاريخ بشرية واضحة.

النتيجة المتوقعة: قيمة مثل 26/2/2026.

خطأ شائع: نسيان +1 للشهر فيظهر رقم أقل من المتوقع.

5) الفرق بين تاريخين (بالأيام)

const today = new Date();
const deadline = new Date(2026, 11, 31);

const diffMs = deadline - today;
const diffDays = Math.ceil(diffMs / (1000 * 60 * 60 * 24));

console.log(diffDays);

ماذا يفعل هذا الكود؟ يحسب عدد الأيام المتبقية حتى موعد معين.

النتيجة المتوقعة: رقم أيام مفيد للعدادات والتنبيهات.

خطأ شائع: نسيان التحويل من ميلي ثانية إلى أيام فيظهر رقم كبير جداً.

6) استخدام toLocaleDateString() للتنسيق المحلي

const now = new Date();

console.log(now.toLocaleDateString("ar-EG"));
console.log(now.toLocaleDateString("en-US"));

ماذا يفعل هذا الكود؟ يعرض التاريخ بصيغة محلية حسب اللغة/المنطقة.

النتيجة المتوقعة: تنسيق مختلف بحسب locale المختار.

خطأ شائع: افتراض أن كل المستخدمين يرون نفس تنسيق التاريخ.

Story قصيرة: لماذا الموعد يظهر يوماً قبل المطلوب؟

مطور حفظ تاريخ موعد دون الانتباه للمنطقة الزمنية. بعض المستخدمين رأوا التاريخ ناقص يوم. بعد توحيد التنسيق واختبار الوقت المحلي، أصبح العرض صحيحاً للجميع.

أهم دوال Date بسرعة

Checklist سريعة

• أعرف أن new Date() يعطي التاريخ الحالي.
• أتذكر أن الأشهر تبدأ من 0.
• أستطيع تنسيق التاريخ للعرض.
• أستطيع حساب فرق الأيام بين تاريخين.

الأسئلة الشائعة — FAQ

كيف أحصل على التاريخ الحالي؟

استخدم new Date() للحصول على تاريخ/وقت اللحظة الحالية.

لماذا getMonth تعيد 0 في يناير؟

لأن JavaScript تعتمد عدّ الأشهر من 0 إلى 11.

كيف أحسب الفرق بين تاريخين؟

اطرح التاريخين لتحصل على ميلي ثانية، ثم حوّلها إلى أيام أو ساعات.

للمراجعة: Math. للمتابعة: Common Mistakes.