Остаточний спосіб форматування дат для міжнародних сайтів
Формати дат змінюються залежно від регіону та мови, тому завжди корисно, якщо ми знайдемо спосіб відображення дат користувачам, що стосуються їх мови та регіону..
Ще в грудні 2012 року ECMA опублікувала специфікацію API інтернаціоналізації для JavaScript. API інтернаціоналізації допомагає нам відображати певні дані відповідно до мови та специфікації. Його можна використовувати визначення валют, часових поясів і більше.
У цій посаді ми будемо вивчати форматування дати використовуючи цей API.
Знайте локаль користувача
Щоб показати дату відповідно до бажаної мови користувача, спочатку потрібно знати, що таке бажаний мовний код. В даний час надійний спосіб дізнатися, що це запитати користувача; дозволити користувачам вибрати потрібні налаштування мови та регіону на веб-сторінці.
Але, якщо це не варіант, ви можете інтерпретувати Accept-Language запит заголовка або прочитати navigator.language(для Chrome і Firefox) або navigator.browserLanguage(для IE) значень.
Будь ласка, знайте, що не всі з цих параметрів повертають бажану мову інтерфейсу браузера.
var language_tag = window.navigator.browserLanguage || window.navigator.language || "en"; // повертає мовні теги типу 'en-GB'
Перевірити API інтернаціоналізації
Щоб знати, чи підтримує браузер API інтернаціоналізації, ми можемо перевірити наявність глобального об'єкта Intl.
if (window.hasOwnPropertyâ €)‹("Intl") && typeof Intl === "object") // API інтернаціоналізації, використовуйте цей код The Intl об'єкт
Intl є глобальним об'єктом використання API інтернаціоналізації. Вона має три властивості, які є конструкторами для трьох об'єктів, а саме Collator, NumberFormat, і DateTimeFormat.
Об'єкт, який ми будемо використовувати, це DateTimeFormat які допоможуть нам форматувати дату як на різних мовах.
The DateTimeFormat об'єкт
The DateTimeFormat конструктор приймає два необов'язкові аргументи;
локалі- рядок або масив рядків, які представляють, наприклад, теги мов; “де” для німецької мови, “en-GB” англійською мовою, що використовується у Великобританії. Якщо мовний тег не згадується, то локаль за замовчуванням буде такою, як у середовищі виконання.опції- об'єкт, властивості якого використовуються для налаштування формату. Він має такі властивості:
| Нерухомість | Опис | Можливі значення |
| день | День місяця | “2-значний”, “числовий” |
| епохи | Ера дату потрапляє, Ex: BC | “вузький”, “короткий”, “довго” |
| formatMatcher | Алгоритм, що використовується для відповідності формату | “основний”, “найкраще підходять”[За замовчуванням] |
| годину | Представляє Години часу | “2-значний”, “числовий” |
| година12 | Вказує 12-годинний формат (вірно) або 24-годинний формат (помилковий) | вірно, помилковий |
| localeMatcher | Алгоритм, який використовується для узгодження локалі | “пошук”, “найкраще підходять”[За замовчуванням] |
| хвилини | Хвилин на час | “2-значний”, “числовий” |
| місяць | Місяць на рік | “2-значний”, “числовий”, “вузький”, “короткий”, “довго” |
| другий | Секунди за часом | “2-значний”, “числовий” |
| часовий пояс | Часовий пояс для застосування | “UTC”, за замовчуванням - це часовий пояс |
| timeZoneName | Часовий пояс дати | “короткий”, “довго” |
| день тижня | День тижня | “вузький”, “короткий”, “довго” |
| рік | Рік дати | “2-значний”, “числовий” |
Приклад:
var formatter = new Intl.DateTimeFormat ('en-GB'); / * повертає формати, які можуть форматувати дату у форматі дати англійською мовою * / var options = weekday: 'short'; var formatter = new Intl.DateTimeFormat (опції 'en-GB'); / * повертає формуляр, який може форматувати дату у форматі дати англійською мовою * разом із днем тижня в короткій нотації, подібною до "Thu" на четвер
The форматі функції
Екземпляр DateTimeFormat об'єкт має властивість accessor (getter) форматі яка повертає функцію, що форматує a Дата на основі локалі і опції знайдено в DateTimeFormat наприклад.
Функція приймає a Дата об'єкт або undefined як необов'язковий аргумент і повертає a рядок у потрібному форматі дати.
Примітка: Якщо аргумент є або undefined або не надається, тоді він повертає значення Date.now () у потрібному форматі дати.
Ось синтаксис:
new Intl.DateTimeFormat (). format () // поверне поточну дату у форматі дати виконання
А тепер давайте кодуємо просте форматування дат.
Давайте змінимо мову і побачимо вихід.
Тепер настав час шукати варіанти.
The toLocaleDateString метод
Замість використання форматирования, як показано в наведених вище прикладах, можна також використовувати Date.prototype.toLocaleString таким же чином з локалі і опції аргументи, вони схожі, але рекомендується використовувати DateTimeFormat об'єкт, коли ви маєте справу з занадто великою кількістю дат у вашому додатку.
var mydate = new Date ("2015/04/22"); var options = день тижня: "короткий", рік: "числовий", місяць: "довгий", день: "числовий"; console.log (mydate.toLocaleDateString ('en-GB', варіанти)); // повертається "Wed, 22 April 2015" Перевірити, якщо локалі підтримуються
Щоб перевірити підтримку локалі, ми можемо використовувати цей метод supportedLocalesOf з DateTimeFormat об'єкт. Вона повертає масив всіх підтримуючих локалей або порожній масив, якщо жодна з локалей не підтримується.
Для тестування додамо фіктивний локаль “бла” у списку локалей, які потрібно перевірити.
console.log (Intl.DateTimeFormat.supportedLocalesOf (["zh", "blah", "fa-pes"])); // повертає масив ["zh", "fa-pes"]
Підтримка браузера
Наприкінці квітня 2015 року основні браузери підтримують API інтернаціоналізації.
Список літератури
- ECMA Міжнародний: Спеціальність API інтернаціоналізації ECMAScript
- IANA: Реєстр мов Subtag
- Корнер Норберта: API інтернаціоналізації ECMAScript
