При разработке нередко возникает необходимость работать с датой и временем. В этой статье мы рассмотрим класс для работы с датой Date в JavaScript и изучим, как получать и устанавливать компоненты даты, форматировать, а также выполнять арифметические операции с датами.
Класс Date и создание объекта даты
Для работы с датой и временем в JavaScript существует специальный класс Date. Он предоставляет методы и свойства, которые позволяют производить различные манипуляции с датой и временем: создание текущей либо конкретной даты, ее изменение, получение определенных компонентов. Помимо этого, класс позволяет производить различные арифметические действия над датой и временем.
Для создания объекта даты в JavaScript можно использовать несколько различных способов:
- Создание текущей даты производится самым простым способом — вызовом конструктора без аргументов. В этом случае конструктор создаст объект, содержащий текущую дату и время:
const currentDate = new Date(); console.log(currentDate); // Thu Jun 22 2023 21:13:42 GMT+0300 (Москва, стандартное время)
- Если необходимо создать объект конкретной даты, конструктору можно передать аргумент в виде строки с указанием определенной даты и времени.
const specificDate = new Date('2024-08-12 14:30');
console.log(specificDate); // Mon Aug 12 2024 14:30:00 GMT+0300 (Москва, стандартное время) - Создать конкретную дату можно также и иным способом — передачей в конструктор нескольких аргументов. Эти аргументы представлены в виде отдельных чисел, указывающих части даты в таком порядке: год, месяц, день, часы, минуты, секунды:
const specificDate = new Date(2024, 3, 10, 11, 20, 15); console.log(specificDate); // Wed Apr 10 2024 11:20:15 GMT+0300 (Москва, стандартное время)
Здесь нужно обратить внимание, что числа месяцев (второй аргумент) берут отсчет от 0 (январь) до 11 (декабрь). В нашем примере число 3 означает апрель.
Стоит отметить, что объекты класса Date в JavaScript представляют дату и время в виде числовых значений, основанных на временной зоне, установленной на устройстве, где выполняется скрипт. Внутри объекта Date время представлено в виде количества миллисекунд, прошедших с 1 января 1970 года 00:00:00 по UTC. Это значение называется «временной меткой» или «таймстампом».
Методы класса Date для получения компонентов даты
Класс Date предоставляет различные методы для получения отдельных компонентов даты:
getFullYear()— возвращает год в формате, состоящем из четырех цифр (например, 2023);getMonth()— получение номера месяца от 0 (январь) до 11 (декабрь);getDate()— извлекает день месяца от 1 до 31;getDay()— получение дня недели от 0 до 6, где 0 соответствует воскресенью, 1 — понедельнику и так далее, а 6 — субботе;getHours()— количество часов от 0 до 23;getMinutes()— количество минут от 0 до 59;getSeconds()— количество от 0 до 59;getMilliseconds()— количество миллисекунд от 0 до 999;getTime()— извлечение количества миллисекунд, прошедших с 1 января 1970 г. UTC.
Текущее время в миллисекундах также можно получить и без создания объекта
Date— с помощью методаDate.now(). Результат будет аналогичен вызову методаgetTime()у объекта.
const currentDate = new Date(); console.log(currentDate); // Sat Jun 24 2023 11:57:48 GMT+0300 (Москва, стандартное время) console.log(currentDate.getFullYear()); // 2023 console.log(currentDate.getMonth()); // 5 console.log(currentDate.getDate()); // 24 console.log(currentDate.getDay()); // 6 console.log(currentDate.getHours()); // 11 console.log(currentDate.getMinutes()); // 57 console.log(currentDate.getSeconds()); // 48 console.log(currentDate.getMilliseconds()); // 361 console.log(currentDate.getTime()); // 1687597068361 console.log(Date.now()); // 1687597068361
Вышеперечисленные методы возвращают значения, соответствующие текущему часовому поясу (таймзоне). У каждого из этих методов есть альтернативный метод, содержащий в своем названии «UTC» после «get». Поэтому, если необходимо получить значения даты в UTC, нужно воспользоваться этими методами:
getUTCFullYear(),getUTCMonth(),getUTCDate(),getUTCDay(),getUTCHours(),getUTCMinutes(),getUTCSeconds(),getUTCMilliseconds().
Методы класса Date для установки компонентов даты
Для установки компонентов даты в объекте класса Date также есть специальные методы:
setFullYear()— устанавливает значение года;setMonth()— задает номер месяца от 0 (январь) до 11 (декабрь);setDate()— установка значения дня в месяце;setHours()— задать количество часов;setMinutes()— установить количество минут;setSeconds()— установка количества секунд;setMilliseconds()— задает количество миллисекунд;setTime()— создает дату с компонентами, рассчитанными по количеству миллисекунд, прошедших с 1 января 1970 г. UTC.
const date = new Date();
// зададим значение каждого компонента
date.setFullYear(2025);
date.setMonth(10);
date.setDate(18);
date.setHours(14);
date.setMinutes(27);
date.setSeconds(38);
date.setMilliseconds(0);
console.log(date); // Tue Nov 18 2025 14:27:38 GMT+0300 (Москва, стандартное время)
// установим значения компонентов с помощью метода setTime()
date.setTime(1832599428468);
console.log(date); // Thu Jan 27 2028 18:23:48 GMT+0300 (Москва, стандартное время) Так же, как и методы получения компонентов, методы установки имеют альтернативные варианты (кроме
setTime()) для установки дат в UTC:setUTCFullYear(),setUTCMonth(),setUTCDate(),setUTCDay(),setUTCHours(),setUTCMinutes(),setUTCSeconds(),setUTCMilliseconds().
Форматирование даты
Для форматирования даты в определенный текстовый формат в классе Date также существует несколько методов:
toLocaleString()— вернет строку, представляющую полное локализованное представление даты и времени, включая как дату, так и время.toLocaleDateString()— возвращает строку, представляющую дату в локализованном формате. Формат даты будет зависеть от языка и настроек локали на устройстве пользователя.toLocaleTimeString()— получение строки, представляющей время в формате, соответствующем языковым и региональным настройкам пользователя.
const date = new Date(); // получим данные по умолчанию, исходя из настроек локали console.log(date.toLocaleString()); // 24.06.2023, 14:59:12 console.log(date.toLocaleDateString()); // 24.06.2023 console.log(date.toLocaleTimeString()); // 14:59:12
Методы toLocaleDateString(), toLocaleTimeString() и toLocaleString() принимают два необязательных аргумента, которые позволяют настраивать формат вывода даты и времени в соответствии с требованиями. Опишем эти аргументы:
locales— первый аргумент, определяющий локаль или список локалей, для которых должно выполняться форматирование. Это может быть строка с языковым кодом (например,'en-US'для английского языка в США) или массив языковых кодов (например,['en-US', 'ru-RU']для английского и русского языков);options— второй аргумент, представляющий собой объект с дополнительными параметрами форматирования. Некоторые из наиболее используемых параметров включают:timeZone— временная зона, в которой должно выполняться форматирование времени;weekday— формат вывода дня недели (возможные значения —narrow,shortиlong);year— формат вывода года (numeric,2-digit);month— формат вывода месяца (numeric,2-digit,narrow,short,long);day— формат вывода дня месяца (numeric,2-digit);hour— формат вывода часов (numeric,2-digit);minute— формат вывода минут (numeric,2-digit);second— формат вывода секунд (numeric,2-digit).
const date = new Date();
const options = {
timeZone: 'UTC',
weekday: 'long',
year: 'numeric',
month: 'short',
day: 'numeric',
hour: 'numeric',
minute: '2-digit',
second: 'numeric'
};
const formattedDateTime = date.toLocaleString('en-US', options);
console.log(formattedDateTime); // Saturday, Jun 24, 2023, 12:15:01 PM Арифметические операции с датами
Напишем пример, каким образом можно выполнять арифметические операции с датами с помощью нативного JavaScript. Допустим, нам необходимо вычислить разницу между двумя заданными датами в определенных единицах (месяцы, дни, часы, минуты, секунды):
// функция для вычисления разницы между двумя датами
function getDateDifference(date1, date2, unit) {
const timeDiff = date2.getTime() - date1.getTime();
switch (unit) {
case 'days':
return Math.floor(timeDiff / (1000 * 60 * 60 * 24));
case 'months':
let months;
months = (date2.getFullYear() - date1.getFullYear()) * 12;
months -= date1.getMonth();
months += date2.getMonth();
return months <= 0 ? 0 : months;
case 'hours':
return Math.floor(timeDiff / (1000 * 60 * 60));
case 'minutes':
return Math.floor(timeDiff / (1000 * 60));
case 'seconds':
return Math.floor(timeDiff / 1000);
default:
return null;
}
}
// создадим две даты
const startDate = new Date(2022, 0, 15); // 15 января 2022 года
const endDate = new Date(2023, 4, 20); // 20 мая 2023 года
// вызывая функцию getDateDifference(), вычислим разницу между датами
const differenceInDays = getDateDifference(startDate, endDate, 'days');
console.log(differenceInDays); // 490 дней
const differenceInMonths = getDateDifference(startDate, endDate, 'months');
console.log(differenceInMonths); // 16 месяцев
const differenceInHours = getDateDifference(startDate, endDate, 'hours');
console.log(differenceInHours); // 11760 часов
const differenceInMinutes = getDateDifference(startDate, endDate, 'minutes');
console.log(differenceInMinutes); // 705600 минут
const differenceInSeconds = getDateDifference(startDate, endDate, 'seconds');
console.log(differenceInSeconds); // 42336000 секунд Заключение
В этой статье мы рассмотрели основы работы с классом Date в JavaScript и познакомились с его различными методами. Возможностей этого класса может быть достаточно для некоторых несложных задач. Однако, если вы ищете более удобные и функциональные способы форматирования, изменения дат, работы с таймзонами, рекомендуется использовать специализированные библиотеки, такие как Moment.js.