Наповнення JS розділу

Добридень, Пані та Панове, завдяки вам вдалося зібрати більше 19тис грн з необхідних 15тис на впровадження JS розділу.

JS розділ вже впроваджено - переходимо до його наповнення і почнемо бігти довгий марафон, адже JS має більше 1100 різноманітних методів, властивостей, подій і т.д., які необхідно описати.

Будемо працювати, і вдень, і вночі, щоб орієнтовно взимку закінчити наповнювати JS розділ!

Ви також можете допомогти нам в цьому. Долучайтеся до нашої спільноти в дискорді - ставайте її частиною і допомагайте нашому розвитку.

Також, підтримуйте нас матеріально.

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

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

Нотатка:

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

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

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

Порада:

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

Синтаксис

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

Параметри

locales

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

Значення:

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

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

options

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

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

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

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

Return

string

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

Переглядачі

Переглядач

1

1

1

5

12

Переглядач

4.4

18

4

1

Переглядач

0.10.0

1.0

Приклади


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

У цьому прикладі ми створюємо новий об'єкт 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 }));

У другому прикладі 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' }));