JS метод Date.setUTCHours()

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

Метод Date.prototype.setUTCHours() дозволяє встановлювати годину, хвилини, секунди та мілісекунди для об’єкту дати згідно з універсальним координованим часом (UTC). Цей метод особливо корисний, коли розробникам потрібно робити корекції часу, адаптувати його до різних часових поясів або виконувати маніпуляції із часом у проектах, де точність часу відіграє ключову роль.

Date.prototype.setUTCHours() широко використовується в різноманітних додатках та системах, де потрібно управляти часом: від простих таймерів і годинників до складних систем планування та управління часом. Наприклад, при розробці системи бронювання, цей метод може бути використаний для встановлення конкретного часу події у UTC, що уникає проблем з часовими поясами.

Для прикладу, якщо ви хочете встановити годину UTC на 15 для об'єкту дати, код буде виглядати так:

let date = new Date();
date.setUTCHours(15);

В даному прикладі, година для об'єкту date буде встановлена на 15 у UTC, і будь-яка різниця у часових поясах буде врахована при відображенні дати.

Також, метод setUTCHours() може приймати до чотирьох параметрів: годину, хвилину, секунду і мілісекунду. Якщо хвилини, секунди, або мілісекунди не вказані, їхні значення за замовчуванням будуть 0:

let date = new Date();
date.setUTCHours(15, 30, 45, 500); // Sets the time to 15:30:45.500 UTC

Існують певні особливості при роботі з Date.prototype.setUTCHours(). Перш за все, метод змінює об’єкт дати на місці, тому якщо потрібно зберегти оригінальний об’єкт дати, рекомендується створювати копію об’єкта. Друге, якщо значення години є більшим за 23 або меншим за 0, метод автоматично корегує дату. Наприклад, якщо ви встановите годину на 25, дата зміниться на наступний день, і година буде 1.

Порада:

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

let originalDate = new Date();
let dateCopy = new Date(originalDate);
dateCopy.setUTCHours(15);

Нотатка:

Завжди пам'ятайте, що Date.prototype.setUTCHours() встановлює час за універсальним координованим часом (UTC), а не за локальним часом. Це важливо враховувати, особливо коли ви працюєте над проектами, які використовують дати та час з різних часових поясів.

Порада:

Варто звертати увагу на автоматичне коригування дати, яке відбувається, коли вказане значення години виходить за рамки 0–23. Наприклад, якщо ви встановите годину як 25, об'єкт дати автоматично коригується на наступний день, і година стає 1. Переконайтеся, що ця особливість не призведе до неочікуваних результатів у вашому коді.

Синтаксис

setUTCHours(hoursValue)
setUTCHours(hoursValue, minutesValue)
setUTCHours(hoursValue, minutesValue, secondsValue)
setUTCHours(hoursValue, minutesValue, secondsValue, msValue)

Параметри

*hoursValue: Ціле число від 0 до 23, яке представляє години.
minutesValue: Ціле число від 0 до 59, яке представляє хвилини.
secondsValue: Ціле число від 0 до 59, яке представляє секунди. Якщо ви вказуєте secondsValue, то повинні також вказати minutesValue.
msValue: Ціле число від 0 до 999, яке представляє мілісекунди. Якщо ви вказуєте msValue, то повинні також вказати minutesValue та secondsValue.

Return

timestamp: Метод модифікує об'єкт Date на місці та повертає новий часовий штамп (timestamp) у вигляді числа. Якщо значенням є NaN (або інші значення, які перетворюються на NaN, наприклад undefined), дата встановлюється як недійсна "Invalid Date", і повертається NaN.

Переглядачі

Переглядач
	1	1	1	4	12

Переглядач
	4.4	18	4	1

Переглядач
	0.10.0	1.0

Приклади

Цей приклад демонструє використання методу setUTCHours() для встановлення години дати об'єкта Date в UTC. Користувач може вводити значення години, яке він хоче встановити, і після натискання кнопки "Встановити годину" виводиться оновлена дата та час UTC.


  See the Pen <a href="https://codepen.io/css_in_ua/pen/qBLpgmq">
  Untitled</a> by css.in.ua (<a href="https://codepen.io/css_in_ua">@css_in_ua</a>)
  on <a href="https://codepen.io">CodePen</a>.

У цьому прикладі ми створюємо новий об'єкт дати – currentDate, який представляє поточний момент часу. За допомогою console.log ми виводимо поточну дату та час в UTC. Потім застосовуємо Date.prototype.setUTCHours(), щоб встановити годину UTC на 20, при цьому хвилини та секунди залишаються без змін. На завершення ми виводимо оновлену дату та час.

let currentDate = new Date(); // Створюємо новий об'єкт дати, який представляє поточний момент часу.
console.log('Початкова дата та час UTC:', currentDate.toUTCString()); // Виводимо початкову дату та час в UTC.

currentDate.setUTCHours(20); // Встановлюємо годину UTC на 20, хвилини та секунди залишаються без змін.
console.log('Оновлена дата та час UTC:', currentDate.toUTCString()); // Виводимо оновлену дату та час в UTC.

У другому прикладі створюється новий об'єкт дати – meetingDate – для планування зустрічі, час вказаний в UTC. Виводимо заплановану дату та час зустрічі. Далі, використовуючи комбінацію getUTCHours() та setUTCHours(), ми переносимо час зустрічі на дві години вперед. Тобто, якщо зустріч була запланована на 16:00 UTC, тепер вона запланована на 18:00 UTC. На завершення виводимо оновлену дату та час зустрічі в UTC.

let meetingDate = new Date('2023-10-21T16:00:00Z'); // Створюємо об'єкт дати для зустрічі з фіксованим часом в UTC.
console.log('Запланована дата та час зустрічі UTC:', meetingDate.toUTCString()); // Виводимо заплановану дату та час зустрічі в UTC.

meetingDate.setUTCHours(meetingDate.getUTCHours() + 2); // Переносимо час зустрічі на 2 години вперед.
console.log('Нова запланована дата та час зустрічі UTC:', meetingDate.toUTCString()); // Виводимо нову заплановану дату та час зустрічі в UTC.

JS довідник

JavaScript

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