Найти в Дзене
Dev Articles

JavaScript Temporal грядёт!

Реализации нового объекта JavaScript Temporal начинают поставляться в экспериментальных версиях браузеров. Это большая новость для веб-разработчиков, поскольку работа с датами и временем в JavaScript станет значительно проще и современнее. Приложения, зависящие от планирования, интернационализации или чувствительных ко времени данных, смогут использовать встроенные возможности языка для эффективного, точного и согласованного представления дат, времени, временных промежутков и календарей. Мы пока далеко от стабильной кроссбраузерной поддержки, и возможны изменения по мере развития реализаций, однако мы можем уже взглянуть на состояние Temporal на сегодняшний день, почему оно вызывает интерес и какие проблемы решает. Чтобы помочь вам разобраться быстрее, на этой неделе было добавлено свыше 270 страниц документации Temporal на MDN с подробными объяснениями и примерами. Для понимания Temporal рассмотрим объект JavaScript Date. Когда JavaScript создавался в 1995 году, объект Date скопирова
Оглавление

Реализации нового объекта JavaScript Temporal начинают поставляться в экспериментальных версиях браузеров. Это большая новость для веб-разработчиков, поскольку работа с датами и временем в JavaScript станет значительно проще и современнее.

Приложения, зависящие от планирования, интернационализации или чувствительных ко времени данных, смогут использовать встроенные возможности языка для эффективного, точного и согласованного представления дат, времени, временных промежутков и календарей. Мы пока далеко от стабильной кроссбраузерной поддержки, и возможны изменения по мере развития реализаций, однако мы можем уже взглянуть на состояние Temporal на сегодняшний день, почему оно вызывает интерес и какие проблемы решает.

Чтобы помочь вам разобраться быстрее, на этой неделе было добавлено свыше 270 страниц документации Temporal на MDN с подробными объяснениями и примерами.

Что такое JavaScript Temporal?

Для понимания Temporal рассмотрим объект JavaScript Date. Когда JavaScript создавался в 1995 году, объект Date скопировали из ранней реализации Java — java.util.Date, известной своими недостатками. Java заменила эту реализацию в 1997 году, но JavaScript остался привязанным к той же устаревшей API почти на протяжении трех десятилетий, несмотря на известные проблемы.

Основные недостатки объекта Date заключаются в поддержке лишь локального времени пользователя и UTC, отсутствии временной зоны, ненадежности парсинга и мутабельности самого объекта, что может привести к трудно отслеживаемым ошибкам. Другие сложности включают вычисления с учетом перехода на летнее время (DST) и исторических изменений календаря, которые крайне сложны в обработке.

Все эти проблемы делают работу с датами и временем в JavaScript сложной и подверженной багам, что серьезно влияет на некоторые системы. Большинство разработчиков полагается на специализированные библиотеки вроде Moment.js и date-fns для лучшей обработки дат и времени в приложениях.

Temporal разработан как полная замена объекта Date, обеспечивая надежную и предсказуемую обработку дат и времени. Temporal добавляет поддержку временных зон и календарных представлений, многочисленные встроенные методы для преобразований, сравнений и расчетов, форматирования и многого другого. Интерфейс API включает более 200 утилитарных методов, о каждом из которых можно подробно прочитать в документации Temporal на MDN.

Основные концепции

В Temporal ключевыми понятиями являются моменты (уникальные точки истории), местное время (время, соответствующее часовому поясу) и промежутки времени (длительность). Структура API построена таким образом, чтобы эффективно обрабатывать эти концептуальные элементы:

  • Продолжительность: Temporal.Duration — разница между двумя точками во времени.
  • Точки во времени:
    Уникальная точка во времени:
    Как отметка времени: Temporal.Instant
    Дата-время с указанием временной зоны: Temporal.ZonedDateTime
    Без учета временной зоны («чистое» время):
    Полная дата и время: Temporal.PlainDateTime
    Только дата: Temporal.PlainDate
    Год и месяц: Temporal.PlainYearMonth
    Месяц и день: Temporal.PlainMonthDay
    Только время: Temporal.PlainTime
  • Сейчас: получение текущего времени с использованием различных классов Temporal.now или в определенном формате.

Примеры использования Temporal

Некоторые базовые сценарии использования Temporal включают получение текущих дат и времени в виде строки формата ISO, однако, как видно из примера ниже, теперь мы можем указывать временные зоны практически с любым методом, устраняя необходимость вручную производить сложные расчеты:

-2

Работа с различными календарями также становится проще благодаря тому, что можно создавать даты в системах календаря отличных от григорианского, таких как еврейский, китайский и исламский календарь. Следующий код помогает определить, когда наступит следующий Китайский Новый год:

-3

Обработка Unix-тimestamps — довольно распространенная задача, так как многие системы (API, базы данных) используют этот формат для представления времени. Ниже приведён пример того, как создать экземпляр Instant из Unix-кода эпохи в миллисекундах, получить текущее время с помощью Temporal.Now, а затем рассчитать количество часов до наступления указанного момента:

-4

На данный момент метод toLocaleString не учитывает поправку на часовой пояс в реализации Firefox, поэтому длительность возвращается в формате без учета временных зон (PT31600H). Однако это скорее дизайнерское решение, нежели техническая проблема, возможность работы с временными интервалами доступна, поэтому реализация полифилла и реализация в Firefox могут со временем сблизиться.

Есть много интересных моментов, заслуживающих внимания, одним из них является паттерн метода compare(), позволяющий элегантно и эффективно сортировать длительности:

-5

Пробуйте Temporal и поддержка браузеров

Поддержка постепенно внедряется в экспериментальные релизы браузеров, причем наиболее зрелая реализация сейчас наблюдается в Firefox. В Firefox Temporal доступен в ночной сборке (Nightly) по умолчанию при включении параметра javascript.options.experimental.temporal. Для полной картины совместимости вы можете ознакомиться с обширным разделом Совместимость браузеров с Temporal Object.

Вот ключевые баги браузеров, отслеживающие реализацию Temporal:

Кроме того, вы можете посетить сайт https://tc39.es/proposal-temporal/docs/, где доступен полифилл @js-temporal/polyfill. Таким образом, вы сможете попробовать примеры прямо в консоли разработчика любого браузера без необходимости менять флаги или настройки.

Поскольку экспериментальные реализации становятся доступными, сейчас самое подходящее время познакомиться с Temporal и освоиться с современными методами работы с датами и временем в JavaScript.

См. также

Оригинал статьи читайте по ссылке