Dan Levy

اختبار: 14 سؤالاً عن التواريخ في JavaScript

تعلم كيف تبهر في الحفلات بأسرار جافا سكريبت! ✨

إلى أي مدى تعرف كلاس Date؟

  • أثبت مهاراتك في JavaScript! 🚀
  • لا حاجة لتسجيل الدخول أو الاشتراك. ✨
  • اختيار من متعدد. 🤖 … ما مدى صعوبة الأمر، هاه؟

المخطط

كلاس Date في JavaScript لديه واجهة برمجية صعبة السمعة. لقد تم توريثه من Java، ولا يسعني إلا أن أفترض أنه مستوحى من طرق حفظ الوقت في العصر الحجري القديم.

الصراع مع Date يدفع العديد من المطورين لاستخدام مكتبات الطرف الثالث دون تردد. على الرغم من أنها غالبًا ما تكون خيارًا آمنًا وموثوقًا، إلا أن هذه المكتبات نادرًا ما تكون ضرورية لتنسيق التواريخ أو التوطين!

هذا الاختبار مصمم لاختبار (وتعميق) معرفتك بواجهة Date الأصلية. استخدم الأزرار الخضراء للحصول على تلميحات وشروحات! نأمل أنه بحلول نهاية التحدي ستكون قد عززت فهمك لـ Date في JavaScript.

ملاحظة: افترض أن جميع الأمثلة تفترض المنطقة الزمنية المحلية GMT-7.

👇 14 سؤالاً أدناه 👇

1. 

التعامل مع التواريخ

أي تاريخ تقويمي محلي يمثله كائن Date الناتج؟ قد يختلف تنسيق عرضه في وحدة التحكم.

const d1 = new Date(2020, 1, 1)
console.log(d1)

وسيطة الشهر تبدأ من الصفر. بنطاق من 0 إلى 11 (باستخدام التقويم الغربي).

‘فبراير’ لها قيمة فهرس تساوي واحد. (فكر فيها كالبحث في مصفوفة.)

2. 

التعامل مع التواريخ

أي تاريخ تقويمي محلي يمثله كائن Date الناتج؟ قد يختلف تنسيق عرضه في وحدة التحكم.

const d2 = new Date(2020, 0, 1)
console.log(d2)

وسيطة الشهر تبدأ من الصفر. نطاقها 0-11 (باستخدام التقويم الغربي.)

‘يناير’ له قيمة فهرس صفر. (فكر في الأمر مثل البحث في مصفوفة.)

3. 

التعامل مع التواريخ

ماذا سيتضمن المخرَج؟

const d3 = Date('Thu, 01 Jan 1970 00:00:00 GMT')
console.log(d3)

استدعاء Date(...) دون new صالح، لكنه يتجاهل الوسائط ويُرجع سلسلة نصية تمثل التاريخ والوقت الحاليين بالتوقيت المحلي. أما new Date(...) فينشئ كائن تاريخ باستخدام الوسائط.

4. 

التعامل مع التواريخ

افترض أن إزاحة المنطقة الزمنية المحلية هي GMT−07:00 في هذا المثال. ماذا سيتضمن المخرَج؟

const date = new Date(2020)
console.log(date.getFullYear())

يتم تفسير كائن Date الذي تم إنشاؤه باستخدام وسيطة عددية واحدة على أنه قيمة Unix Epoch.

Epoch هو عدد الميلي ثانية منذ 1 يناير 1970.

قيمة 2020 (ميلي ثانية) تُترجم إلى ثانيتين بعد 1 يناير 1970.

ثم نظرًا لأن منطقتنا الزمنية المحلية لها إزاحة سلبية قدرها -7 ساعات، نحصل على Wed Dec 31 1969 17:00:02 GMT-0700 (Mountain Standard Time).

يمكنك تجاوز إزاحة المنطقة الزمنية المحلية باستخدام .getUTCFullYear().

5. 

التعامل مع التواريخ

افترض أن إزاحة المنطقة الزمنية المحلية هي GMT−07:00 في هذا المثال. ما القيمة التي ستُطبع في وحدة التحكم؟

const d1 = new Date('2020-01-01')
const d2 = new Date('2020-01-01T00:00')
console.log(d1.getFullYear(), d2.getFullYear())

قد تبدو السلسلة بدون قيمة زمنية T وكأنها 1 يناير 2020 - لكن سلاسل التاريخ فقط تُفسر على أنها UTC، وعند تعديلها إلى منطقتنا الزمنية المحلية (GMT-7) نجد أننا لا نزال في 2019.

سلاسل التاريخ-الوقت بدون منطقة زمنية صريحة تُفسر بالتوقيت المحلي.

الصيغة T00:00 تجعل القيمة الثانية تُفسر على أنها منتصف الليل المحلي.

التاريخ الأول يُفسر على أنه Tue Dec 31 2019 17:00:00 GMT-0700 (Mountain Standard Time). التاريخ الثاني يُفسر على أنه Wed Jan 01 2020 00:00:00 GMT-0700 (Mountain Standard Time).

6. 

التعامل مع التواريخ

اختر طريقة تنسيق غير صحيحة:

الطريقة toLocaleFormat() ليست جزءًا من معيار ECMAScript. استخدم toLocaleDateString() أو toLocaleString() لكتابة كود قابل للنقل بين البيئات.

اطّلع على وثائق toLocaleDateString docs. سلوكها موثق تحت Intl.DateTimeFormat.

7. 

التعامل مع التواريخ

ما الذي سيحتويه المخرَج؟

var date = Date.UTC('2020-01-02T00:00')
console.log(date.toUTCString())

يحوّل Date.UTC() هنا السلسلة المعطاة إلى عدد، فتنتج NaN؛ فهو يتوقع معاملات رقمية للسنة والشهر وما يليهما. ثم يؤدي استدعاء toUTCString() على القيمة العددية إلى TypeError، لأن هذه الدالة تخص كائنات Date.

8. 

التعامل مع التواريخ

ماذا سيتضمن المخرَج؟

const d = Date.UTC(2020, 0, 1)
console.log(d)

الطريقة المساعدة Date.UTC لا تُرجع مثيل تاريخ. إنها تُرجع عددًا صحيحًا بالمللي ثانية.

9. 

التعامل مع التواريخ

افترض أن إزاحة المنطقة الزمنية المحلية هي GMT−07:00 في هذا المثال. ماذا سيتضمن المخرَج؟

// Assume local TZ is -07:00
const d = new Date(Date.UTC(2020, 0, 1))
console.log(d.getTimezoneOffset())

مع إزاحة GMT−07:00، تُرجع getTimezoneOffset() الفرق بالدقائق بين التوقيت المحلي وUTC: القيمة 420. لا يخزن كائن Date منطقة زمنية؛ يستخدم إعدادات البيئة. وقد تختلف الإزاحة حسب التاريخ بسبب التوقيت الصيفي.

10. 

التعامل مع التواريخ

أي تاريخ تقويمي محلي يمثله كائن Date الناتج؟ قد يختلف تنسيق عرضه في وحدة التحكم.

const d = new Date(2020, 0, 1)
d.setDate(1)
console.log(d)

تقوم طريقة .setDate() بتعيين يوم الشهر، بناءً على الشهر الحالي للمثيل.

إذا تم توفير قيمة خارج نطاق الأيام المتاحة، سيتم تعديل قيمة شهر المثيل (مثلًا: استدعاء setDate(32) في يناير سيؤدي إلى حساب الأول من فبراير).

11. 

التعامل مع التواريخ

أي تاريخ تقويمي محلي يمثله كائن Date الناتج؟ قد يختلف تنسيق عرضه في وحدة التحكم.

const d = new Date(2020, 0, 1)
d.setMonth(1)
console.log(d)

تقوم طريقة .setMonth() بتعيين شهر المثيل التاريخي المُعطى.

الوسيطة الشهرية تبدأ من الصفر، بنطاق 0-11 (باستخدام التقاويم الغربية).

12. 

التعامل مع التواريخ

أي تاريخ تقويمي محلي يمثله كائن Date الناتج؟ قد يختلف تنسيق عرضه في وحدة التحكم.

const d = new Date(2020, 0, 1)
d.setMonth(12)
console.log(d)

تحدد طريقة .setMonth() شهر مثيل التاريخ المُعطى.

الوسيط month يبدأ من الصفر، مع 12 قيمة في النطاق من 0 إلى 11 (باستخدام التقاويم الغربية).

هنا نرى أن السنة تم تعديلها إلى 2021، لأن setMonth(12) يزيد بمقدار 1 عن 11 (ديسمبر).

13. 

التعامل مع التواريخ

أي تاريخ تقويمي محلي يمثله كائن Date الناتج؟ قد يختلف تنسيق عرضه في وحدة التحكم.

const d = new Date(2020, 0, 1)
d.setMonth(13)
console.log(d)

تقوم طريقة .setMonth() بتعيين شهر مثيل التاريخ المحدد.

وسيطة الشهر تبدأ من الصفر، ونطاقها من 0 إلى 11 (باستخدام التقويم الغربي).

هنا نرى أن الشهر والسنة تم تعديلهما إلى فبراير 2021، لأن setMonth(13) يزيد بمقدار 2 عن 11 (ديسمبر).

14. 

التعامل مع التواريخ

أي تاريخ تقويمي محلي يمثله كائن Date الناتج؟ قد يختلف تنسيق عرضه في وحدة التحكم.

const d = new Date(2020, 0, 1)
d.setMonth(-1)
console.log(d)

طريقة .setMonth() تحدد شهر مثيل التاريخ المعطى.

وسيطة الشهر تبدأ من الصفر، بنطاق 0-11 (باستخدام التقويم الغربي).

هنا نرى أن الشهر والسنة يعودان إلى ديسمبر 2019، لأن setMonth(-1) أقل من 0 (يناير).

Loading comments...