Работа с датами: Date API, форматирование и вычисления
Что такое Date API и зачем он нужен?
Даты — основа многих приложений: от календарей до систем логирования. В JavaScript работа с датами строится вокруг объекта Date. Он позволяет:
- создавать текущую или конкретную дату,
- форматировать её в читаемый вид,
- выполнять вычисления (разница между датами, добавление дней и т.д.).
💡 Все даты в JavaScript хранятся как количество миллисекунд с 1 января 1970 года (Unix-эпоха). Это внутреннее представление, но методы
Dateпреобразуют его в удобные форматы.
Создание дат
Используйте конструктор new Date(). Варианты создания:
// Текущая дата и время
const now = new Date();
console.log(now); // Sun May 19 2024 15:30:00 GMT+0300
// Конкретная дата (год, месяц, день)
const birthday = new Date(1995, 11, 17); // Месяцы нумеруются с 0 (0 — январь)
console.log(birthday); // Sun Dec 17 1995 00:00:00 GMT+0300
// Через строку в формате ISO
const meeting = new Date('2024-05-20T14:00:00');
console.log(meeting); // Mon May 20 2024 14:00:00 GMT+0300
📌 Особенности:
- Месяцы считаются с 0 (0 — январь, 11 — декабрь).
- Если не указать время, будет 00:00:00.
Получение компонентов даты
Date предоставляет методы для извлечения частей даты:
const date = new Date();
console.log(date.getFullYear()); // 2024 (год)
console.log(date.getMonth()); // 4 (май, т.к. нумерация с 0)
console.log(date.getDate()); // 19 (число месяца)
console.log(date.getDay()); // 0 (воскресенье, 0-6)
console.log(date.getHours()); // 15 (часы)
console.log(date.getMinutes()); // 30 (минуты)
⚠️
getYear()устарел (возвращает год минус 1900). Всегда используйтеgetFullYear()!
Для UTC-версий методов добавьте UTC:
console.log(date.getUTCHours()); // 12 (15:00 MSK = 12:00 UTC)
Форматирование дат
Стандартный toString() не всегда удобен. Вот альтернативы:
Вариант 1: toLocaleString()
const date = new Date();
console.log(date.toLocaleDateString()); // "19.05.2024"
console.log(date.toLocaleTimeString()); // "15:30:00"
console.log(date.toLocaleString('en-US')); // "5/19/2024, 3:30:00 PM"
Можно настроить формат через параметры:
const options = {
weekday: 'long',
year: 'numeric',
month: 'long'
};
console.log(date.toLocaleDateString('ru-RU', options));
// "воскресенье, 19 мая 2024 г."
Вариант 2: Библиотеки
Для сложного форматирования используют Intl.DateTimeFormat или библиотеки вроде date-fns/moment.js.
Вычисления с датами
Даты можно сравнивать и изменять, но есть нюансы.
Сравнение
const now = new Date();
const future = new Date(2025, 0, 1);
console.log(now < future); // true (сравнение через миллисекунды)
Разница между датами
Используйте разницу в миллисекундах:
const start = new Date(2024, 0, 1);
const end = new Date(2024, 5, 1);
const diffMs = end - start; // Разница в миллисекундах
const diffDays = diffMs / (1000 * 60 * 60 * 24); // Перевод в дни
console.log(diffDays); // 152 (дней между 1 января и 1 июня)
Изменение дат
Мутирование через методы:
const date = new Date();
date.setMonth(date.getMonth() + 3); // Добавить 3 месяца
console.log(date); // Август 2024
Создание новой даты (неизменяемый подход):
const date = new Date();
const newDate = new Date(date.getTime());
newDate.setDate(date.getDate() + 10); // +10 дней
Работа с временными зонами
По умолчанию Date использует локальную зону браузера. Для UTC:
const date = new Date();
console.log(date.toUTCString()); // "Sun, 19 May 2024 12:30:00 GMT"
📌 Для серьёзных временных операций используйте библиотеки (
moment-timezone), так как стандартныйDateне поддерживает названия зон.
Практические примеры
1. Таймер обратного отсчета
function getRemainingTime(targetDate) {
const now = new Date();
const diffMs = targetDate - now;
const days = Math.floor(diffMs / (1000 * 60 * 60 * 24));
const hours = Math.floor((diffMs % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
return { days, hours };
}
const newYear = new Date(2025, 0, 1);
console.log(getRemainingTime(newYear)); // { days: 225, hours: 8 }
2. Форматирование длительности
function formatDuration(ms) {
const seconds = Math.floor(ms / 1000) % 60;
const minutes = Math.floor(ms / (1000 * 60)) % 60;
return `${minutes}m ${seconds}s`;
}
console.log(formatDuration(125000)); // "2m 5s"
Итоги
- 📅
Date— мощный, но неидеальный API. Для сложных задач подключайте библиотеки. - 🔢 Месяцы нумеруются с 0, дни недели — с 0 (воскресенье).
- ⏳ Все даты внутри — миллисекунды с 1970 года.
- 🌍 Учитывайте временные зоны при работе с серверными данными.
Теперь вы готовы к работе с датами в реальных проектах! 🚀