طريقة نهائية لتنسيق التواريخ للمواقع الدولية
تختلف تنسيقات التواريخ باختلاف المنطقة واللغة ، لذلك من المفيد دائمًا أن نتمكن من إيجاد طريقة لعرض التواريخ للمستخدمين ، خاصة بلغتهم ومنطقتهم.
في ديسمبر 2012 ، أصدرت ECMA مواصفات API Internationalization لجافا سكريبت. تساعدنا واجهة برمجة التطبيقات الدولية في عرض بعض البيانات وفقًا للغة والمواصفات الشفوية. ويمكن استخدامه ل تحديد العملات ، المناطق الزمنية و اكثر.
في هذا المنصب سوف ننظر في تنسيق التاريخ باستخدام واجهة برمجة التطبيقات هذه.
تعرف لغة المستخدم
لإظهار التاريخ حسب اللغة المفضلة للمستخدم ، نحتاج أولاً إلى معرفة ماهية هذه اللغة المفضلة. حاليا طريقة مضمونة لمعرفة أن نسأل المستخدم. السماح للمستخدمين بتحديد إعدادات اللغة والمنطقة المفضلة لديهم في صفحة الويب.
ولكن ، إذا لم يكن هذا خيارًا ، فيمكنك تفسير قبول اللغة
طلب رأس أو قراءة navigator.language
(لمتصفح Chrome وفايرفوكس) أو navigator.browserLanguage
(لإنترنت إكسبلورر) القيم.
يرجى العلم أن هذه الخيارات ليست كلها تُرجع اللغة المفضلة لمتصفح واجهة المستخدم.
var language_tag = window.navigator.browserLanguage || window.navigator.language || "أون". // ترجع علامات اللغة مثل "en-GB"
تحقق من API التدويل
لمعرفة ما إذا كان المستعرض يدعم API التدويل أم لا ، يمكننا التحقق من وجود الكائن العمومي تي
.
إذا (window.hasOwnPropertyâ €‹("Intl") && typeof Intl === "object") // Internationalization API موجود ، دعونا نستخدم ذلك
ال تي موضوع
تي
هو كائن عالمي لاستخدام API التدويل. لديها ثلاثة خصائص والتي هي بناة لثلاثة أشياء وهي Collator
, NumberFormat
, و DateTimeFormat
.
الكائن الذي سنستخدمه هو DateTimeFormat
مما سيساعدنا في تنسيق وقت التاريخ حسب اللغات المختلفة.
ال DateTimeFormat موضوع
ال DateTimeFormat
يأخذ المنشئ وسيطين اختياريين ؛
لغات
- سلسلة أو مجموعة من السلاسل التي تمثل علامات اللغة ، على سبيل المثال ؛ “دي” للغة الألمانية, “أون-GB” للغة الإنجليزية المستخدمة في المملكة المتحدة. إذا لم يتم ذكر علامة لغة ، ستكون الإعدادات الافتراضية هي لغة التشغيل.خيارات
- كائن تستخدم خصائصه لتخصيص المنسق. له الخصائص التالية:
خاصية | وصف | القيم الممكنة |
يوم | يوم من الشهر | “2-أرقام”, “رقمية” |
عصر | عصر التاريخ يقع ، على سبيل المثال: قبل الميلاد | “ضيق”, “قصيرة”, “طويل” |
formatMatcher | الخوارزمية المستخدمة لمطابقة التنسيق | “الأساسية”, “الأنسب”[افتراضي] |
ساعة | يمثل ساعات في الوقت | “2-أرقام”, “رقمية” |
hour12 | يشير إلى تنسيق 12 ساعة (صحيح ) أو تنسيق 24 ساعة (خاطئة ) | صحيح , خاطئة |
localeMatcher | الخوارزمية المستخدمة لمطابقة الإعدادات المحلية | “ابحث عن”, “الأنسب”[افتراضي] |
اللحظة | دقائق في الوقت | “2-أرقام”, “رقمية” |
شهر | شهر في السنة | “2-أرقام”, “رقمية”, “ضيق”, “قصيرة”, “طويل” |
ثانيا | ثانية في الوقت | “2-أرقام”, “رقمية” |
وحدة زمنية | المنطقة الزمنية للتطبيق | “التوقيت العالمي”, الافتراضي هو وقت التشغيل المنطقة |
timeZoneName | المنطقة الزمنية للتاريخ | “قصيرة”, “طويل” |
يوم من أيام الأسبوع | يوم في الأسبوع | “ضيق”, “قصيرة”, “طويل” |
عام | سنة من التاريخ | “2-أرقام”, “رقمية” |
مثال:
var formatter = new Intl.DateTimeFormat ('en-GB') ؛ / * بإرجاع منسق يمكنه تنسيق تاريخ بتنسيق تاريخ المملكة المتحدة * /
var options = weekday: 'short'؛ var formatter = new Intl.DateTimeFormat ('en-GB' ، خيارات) ؛ / * تقوم بإرجاع المنسق الذي يمكنه تنسيق تاريخ بتنسيق تاريخ المملكة المتحدة باللغة الإنجليزية * إلى جانب أيام الأسبوع بأحرف قصيرة مثل "الخميس" ليوم الخميس * /
ال شكل وظيفة
مثيل DateTimeFormat
يحتوي الكائن على ملحق خاصية (getter) يسمى شكل
التي ترجع وظيفة بتنسيق تاريخ
على أساس لغات
و خيارات
وجدت في DateTimeFormat
حتة.
الوظيفة تأخذ تاريخ
الاعتراض أو غير محدد
كحجة اختيارية وإرجاع أ خيط
في تنسيق التاريخ المطلوب.
ملحوظة: إذا كانت الحجة إما غير محدد
أو لم يتم توفيرها ثم تقوم بإرجاع قيمة Date.now ()
في تنسيق التاريخ المطلوب.
وفيما يلي بناء الجملة:
سيقوم Intl.DateTimeFormat (). format () // بإرجاع التاريخ الحالي بتنسيق تاريخ التشغيل
والآن ، دعنا نرمز لتنسيق تاريخ بسيط.
دعونا نغير اللغة ونرى المخرجات.
الآن ، حان الوقت للنظر في الخيارات.
ال toLocaleDateString طريقة
بدلاً من استخدام المنسق كما هو موضح في الأمثلة أعلاه ، يمكنك أيضًا استخدام Date.prototype.toLocaleString
بنفس الطريقة مع لغات
و خيارات
الحجج ، فهي متشابهة ولكن يوصى باستخدام DateTimeFormat
الاعتراض عند التعامل مع تواريخ كثيرة جدا في التطبيق الخاص بك.
var mydate = new date ('2015/04/22') ؛ var options = weekday: "short"، year: "numeric"، month: "long"، day: "numeric"؛ console.log (mydate.toLocaleDateString ( 'أون-GB "، خيارات))؛ // يعود "الأربعاء ، 22 أبريل 2015"
اختبار إذا كان لغات مدعمون
للتحقق من الدعم لغات
, يمكننا استخدام هذه الطريقة supportedLocalesOf
من DateTimeFormat
موضوع. تقوم بإرجاع مجموعة من كافة اللغات الداعمة أو صفيف فارغ إذا لم يتم دعم أي من اللغات.
للاختبار ، دعونا نضيف لغة وهمية “بلاه” في قائمة لغات ليتم التحقق منها.
console.log (Intl.DateTimeFormat.supportedLocalesOf (["zh"، "blah"، "fa-pes"]))؛ // بإرجاع Array ["zh"، "fa-pes"]
دعم المتصفح
في نهاية أبريل 2015 ، تدعم المتصفحات الرئيسية واجهة التدويل الدولية.
المراجع
- ECMA دولي: ECMAScript Internationalization API API
- IANA: لغة سجل Subtag
- ركن نوربرت: واجهة برمجة تطبيقات ECMAScript Internationalization