JS метод Date.toLocaleTimeString()


Загальний опис

Метод Date.prototype.toLocaleTimeString() конвертує часову частину дати в рядок, представлення якого відповідає локальному часовому поясу. Цей метод призначений для того, щоб зробити представлення часу більш дружнім і зрозумілим для користувачів, не зважаючи на їхні місцеві налаштування і формати часу. Він особливо корисний у ситуаціях, коли потрібно вивести час на веб-сторінці так, щоб він був зрозумілим для користувачів з різних культур та регіонів.

Якщо вам потрібно показати час на сайті для користувачів у різних країнах, ви можете використовувати цей метод для автоматичного адаптування часового формату відповідно до налаштувань користувача. Приклад:

let date = new Date();
let timeString = date.toLocaleTimeString('en-US');
console.log(timeString); // "12:00:00 AM" for en-US locale

У цьому прикладі, toLocaleTimeString() виводить час у форматі, прийнятому в Сполучених Штатах Америки.

Та необмежуйтеся лише веб-розробкою. Date.prototype.toLocaleTimeString() може бути використаний у будь-яких застосунках JavaScript, де потрібно форматувати час, наприклад, в Node.js або інших серверних або клієнтських сценаріях.

Особливість цього методу полягає в тому, що він дозволяє автоматизувати процес локалізації часу, звільняючи розробників від необхідності писати додатковий код для кожної локалі. Він також пропонує гнучкість, оскільки дозволяє передавати конкретні параметри локалі та опції форматування. Приклад:

let date = new Date();
let options = { hour: '2-digit', minute: '2-digit', second: '2-digit', timeZoneName: 'short' };
let timeString = date.toLocaleTimeString('en-GB', options);
console.log(timeString); // "00:00:00 GMT" for en-GB locale

У цьому прикладі метод використовується з додатковими опціями, які дозволяють відобразити час з секундами та абревіатурою часового поясу для Великобританії.

автор: Bond

Порада

Початківцям слід пам'ятати про важливість перевірки підтримки браузерів, оскільки не всі можуть підтримувати Date.prototype.toLocaleTimeString() або його параметри.

автор: Bond
Нотатка

Для більш досвідчених розробників, використання Date.prototype.toLocaleTimeString() може бути корисним для логування з подіями, коли потрібно вивести час події у локальному форматі, зручному для аналізу і читання, особливо, коли робиться спроба відлагодження коду в різних локальних умовах.

автор: Bond
Нотатка

Варто пам’ятати, що Date.prototype.toLocaleTimeString() може приймати додаткові параметри для точного визначення формату часу. Наприклад, можна встановити 24-годинний формат часу або вибрати конкретний стиль відображення.

let timeString = new Date().toLocaleTimeString('en-GB', {hour12: false, timeStyle: 'short'});
автор: Bond

Синтаксис

toLocaleTimeString()
toLocaleTimeString(locales)
toLocaleTimeString(locales, options)

Параметри

locales

Рядок з мовним тегом BCP 47 або масив таких рядків. Відповідає параметру locales конструктора Intl.DateTimeFormat().

Значення:

  • Рядок (наприклад, "en-US", "uk-UA").
  • Масив рядків (наприклад, ["en-US", "fr-FR"]).

У реалізаціях без підтримки Intl.DateTimeFormat, цей параметр ігнорується, і зазвичай використовується локаль хоста.

автор: Bond

options

Об'єкт з налаштуваннями формату виводу. Може містити ряд незобов'язкових властивостей, таких як:

  • dayPeriod: Формат відображення частини доби (наприклад, AM/PM).
  • hour: Формат відображення годин.
  • minute: Формат відображення хвилин.
  • second: Формат відображення секунд.
  • fractionalSecondDigits: Кількість знаків після коми для дробової частини секунди.

Якщо dayPeriod, hour, minute, second та fractionalSecondDigits всі не визначені, то hour, minute, second встановлюються як "numeric".

У реалізаціях без підтримки Intl.DateTimeFormat, цей параметр ігнорується.

автор: Bond

Повернення

string

Повертає рядок, який представляє частину часу даного екземпляру Date відповідно до конвенцій конкретної мови.

автор: Bond

Переглядачі

Підтримка: стаціонарні переглядачі
Переглядач Google Chrome Mozilla Firefox Apple Safari Opera Microsoft EDGE
1 1 1 5 12
Підтримка: мобільні переглядачі
Переглядач Mobile Google Android Mobile Google Chrome Mobile Mozilla Firefox Mobile Apple Safari
4.4 18 4 1
Підтримка: серверні переглядачі
Переглядач Node.js Deno
0.10.0 1.0

Приклади

+ запропонувати свій приклад у пісочниці

У цьому прикладі ми створюємо новий об'єкт Date, що представляє поточний час і дату. Після цього використовуємо toLocaleTimeString() для виведення часу в різних локалях і форматах: за замовчуванням, у Великій Британії з 24-годинним форматом і у Сполучених Штатах з 12-годинним форматом.

// Створюємо новий об’єкт дати
let currentDate = new Date(); 

// Виводимо час у форматі за замовчуванням
console.log('Час за замовчуванням:', currentDate.toLocaleTimeString());

// Виводимо час у британській локації у 24-годинному форматі
console.log('Британський час:', currentDate.toLocaleTimeString('en-GB', { hour12: false }));

// Виводимо час у американській локації у 12-годинному форматі
console.log('Американський час:', currentDate.toLocaleTimeString('en-US', { hour12: true }));
автор: Bond

Цей приклад демонструє використання методу toLocaleTimeString() для відображення часу в різних локаціях, що вибирає користувач через dropdown. Користувач може взаємодіяти зі сторінкою, вибираючи потрібну локацію і бачити відформатований час у відповідності до вибраної локації.

автор: Bond

У другому прикладі Date.prototype.toLocaleTimeString() використовується для форматування часу в українській локації ('uk-UA') з різними стилями часу: 'short' для короткого формату і 'full' для повного формату. Це дозволяє вивести час так, як зручно користувачу, з урахуванням його переваг щодо деталізації інформації про час.

// Створюємо новий об’єкт дати
let currentDate = new Date(); 

// Виводимо короткий формат часу
console.log('Короткий формат:', currentDate.toLocaleTimeString('uk-UA', { timeStyle: 'short' }));

// Виводимо повний формат часу
console.log('Повний формат:', currentDate.toLocaleTimeString('uk-UA', { timeStyle: 'full' }));
автор: Bond

Коментарі

Коментарів ще немає — будьте першим!

Відповідь для

Увійдіть — коментар з'явиться одразу, без капчі й очікування перевірки.

Пропозиція правки

Ваша версія — : після перевірки замінить чинну. Нова порада чи нотатка — з'явиться на сторінці після перевірки.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія секції «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія опису «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Зворотний зв'язок
Вхід