Learn JavaScript

setHours() - изменение часов в дате в JavaScript

setHours() изменяет часы в объекте Date, меняет существующую дату. При необходимости этот метод может сразу обновить не только часы, но и минуты, секунды и миллисекунды.

Синтаксис

Базовая запись выглядит так:

date.setHours(hoursValue)
date.setHours(hoursValue, minutesValue)
date.setHours(hoursValue, minutesValue, secondsValue)
date.setHours(hoursValue, minutesValue, secondsValue, msValue)

Где:

  • date - это объект Date
  • hoursValue - новые часы
  • minutesValue - необязательные минуты
  • secondsValue - необязательные секунды
  • msValue - необязательные миллисекунды

Что возвращает setHours()

Метод возвращает timestamp - количество миллисекунд с 1 января 1970 года.

const date = new Date(2025, 0, 15, 10, 20, 30, 400);
const result = date.setHours(14);

console.log(typeof result); // "number"
console.log(result === date.getTime()); // true
console.log(date.getHours()); // 14

Это важно: setHours() возвращает число, а не новый объект Date.

Простой пример

const date = new Date(2025, 0, 15, 10, 20, 30);

date.setHours(14);

console.log(date.getHours()); // 14

Здесь:

  • 2025 - год
  • 0 - январь
  • 15 - день месяца
  • 10 - исходные часы
  • 20 - минуты

После вызова метода час становится 14.

Обычно используют значения от 0 до 23

В большинстве случаев в setHours() передают обычный час суток:

  • 0 - полночь
  • 12 - полдень
  • 23 - последний час перед следующими сутками
const date = new Date(2025, 0, 15, 10, 20, 30);

date.setHours(0);

console.log(date.getHours()); // 0

Но у setHours() есть полезная особенность: он умеет работать и со значениями вне этого диапазона.

Можно сразу изменить часы, минуты, секунды и миллисекунды

У setHours() есть дополнительные аргументы.

С их помощью можно за один вызов изменить сразу несколько частей времени.

const date = new Date(2025, 0, 15, 10, 20, 30, 400);

date.setHours(14, 45, 50, 900);

console.log(date.getHours()); // 14
console.log(date.getMinutes()); // 45
console.log(date.getSeconds()); // 50
console.log(date.getMilliseconds()); // 900

Если дополнительные аргументы не передавать, текущие минуты, секунды и миллисекунды сохраняются.

setHours() меняет исходную дату

Это главное отличие от методов вроде getHours().

setHours() не просто читает значение, а изменяет сам объект Date.

const date = new Date(2025, 0, 15, 10, 20, 30);

date.setHours(14);

console.log(date.getHours()); // 14

Если объект даты используется в нескольких местах, это поведение важно учитывать.

Чем setHours() отличается от getHours()

Эти методы связаны, но делают разное.

  • getHours() читает часы
  • setHours() изменяет часы
const date = new Date(2025, 0, 15, 10, 20, 30);

console.log(date.getHours()); // 10

date.setHours(14);

console.log(date.getHours()); // 14

setHours() работает по локальному времени

Это важный момент.

Метод setHours() изменяет дату с точки зрения локального часового пояса пользователя.

Если нужно менять часы именно по UTC, используют setUTCHours().

Чем setHours() отличается от setUTCHours()

Разница такая:

  • setHours() изменяет часы по локальному времени
  • setUTCHours() изменяет часы по UTC

Во многих случаях результат будет похожим, но при работе с серверным временем и ISO-строками лучше использовать тот метод, который соответствует вашей задаче.

Часы могут выходить за пределы 0..23

Это одна из полезных особенностей Date.

Если передать значение больше 23, JavaScript автоматически перенесёт дату на следующие сутки.

const date = new Date(2025, 0, 15, 23, 0, 0);

date.setHours(24);

console.log(date.getFullYear()); // 2025
console.log(date.getMonth()); // 0
console.log(date.getDate()); // 16
console.log(date.getHours()); // 0

Здесь 24 означает переход на 00:00 следующих суток.

Можно перейти и на предыдущий день

Если передать отрицательное значение, JavaScript сдвинет дату назад.

const date = new Date(2025, 0, 15, 10, 0, 0);

date.setHours(-1);

console.log(date.getFullYear()); // 2025
console.log(date.getMonth()); // 0
console.log(date.getDate()); // 14
console.log(date.getHours()); // 23

Здесь дата переходит на предыдущий день.

setHours() не меняет минуты сам по себе

Это полезно помнить.

Если передать только первый аргумент, метод меняет только часы, а минуты, секунды и миллисекунды оставляет как есть.

const date = new Date(2025, 0, 15, 10, 20, 30, 400);

date.setHours(14);

console.log(date.getHours()); // 14
console.log(date.getMinutes()); // 20
console.log(date.getSeconds()); // 30

Invalid Date не восстанавливается через setHours()

Если объект уже невалидный, setHours() не сможет сделать его рабочим снова.

const date = new Date("invalid");

console.log(date.setHours(10)); // NaN
console.log(String(date)); // "Invalid Date"

Невалидное значение делает дату Invalid Date

Если в setHours() передать NaN или значение, которое превращается в NaN, результатом будет невалидная дата.

const date = new Date(2025, 0, 15, 10, 0, 0);

console.log(date.setHours(NaN)); // NaN
console.log(String(date)); // "Invalid Date"

Это важно помнить, если часы приходят из формы, API или пользовательского ввода.

setHours() не создаёт новый объект даты

Этот метод не создаёт новую дату рядом со старой.

Он изменяет уже существующий объект Date.

const date = new Date(2025, 0, 15, 10, 20, 30);
const sameDate = date;

date.setHours(14);

console.log(sameDate.getHours()); // 14

Обе переменные указывают на один и тот же объект.

Когда это полезно

setHours() особенно удобен, когда:

  • нужно изменить часы у существующей даты
  • вы сдвигаете время вперёд или назад
  • хотите сразу обновить часы, минуты, секунды и миллисекунды
  • нужно выставить начало или конец определённого времени суток

Пример:

const meeting = new Date(2025, 0, 15, 10, 20, 30);

meeting.setHours(18);

console.log(meeting.getHours()); // 18

Частые ошибки

Ожидать новый объект Date, а не изменение старого

const date = new Date(2025, 0, 15, 10, 20, 30);

date.setHours(14);

console.log(date.getHours()); // 14

Метод меняет исходный объект.

Ожидать объект Date в результате

const date = new Date(2025, 0, 15, 10, 20, 30);
const result = date.setHours(14);

console.log(typeof result); // "number"

Результат метода - timestamp, а не объект даты.

Забывать, что можно передать дополнительные аргументы

const date = new Date(2025, 0, 15, 10, 20, 30, 400);

date.setHours(14, 45, 50, 900);

setHours() умеет менять не только часы, но и остальные части времени.

Думать, что значение больше 23 вызовет ошибку

const date = new Date(2025, 0, 15, 23, 0, 0);

date.setHours(24);

Ошибка не появится. JavaScript просто перенесёт дату на следующие сутки.

Забывать про переход на предыдущий день

const date = new Date(2025, 0, 15, 10, 0, 0);

date.setHours(-1);

Отрицательное значение может перенести дату назад.

Путать setHours() и getHours()

const date = new Date(2025, 0, 15, 10, 20, 30);

console.log(date.getHours()); // 10
date.setHours(14);

Один метод читает значение, другой его изменяет.

Забывать про локальное время

setHours() работает по локальному часовому поясу пользователя.

Если важен именно UTC, лучше смотреть в сторону setUTCHours().

Быстрая памятка

  • setHours() вызывается у объекта Date
  • метод изменяет исходную дату
  • результатом является timestamp
  • можно передать только часы или сразу часы, минуты, секунды и миллисекунды
  • обычно часы идут от 0 до 23
  • значения меньше 0 и больше 23 нормализуются автоматически
  • setHours() работает по локальному времени
  • для UTC есть setUTCHours()
  • у невалидного аргумента результатом будет Invalid Date
  • Invalid Date через setHours() не восстанавливается

Коротко

setHours() в JavaScript нужен, чтобы изменить часы в объекте Date. Главное, что стоит запомнить: метод меняет исходную дату, возвращает timestamp, может сразу принять минуты, секунды и миллисекунды, работает по локальному времени и умеет автоматически переходить на другие сутки, если значение выходит за пределы обычного диапазона.