Новая эра: расчет времени с помощью Moment.js

Новая эра: расчет времени с помощью Moment.js

Расчет временных значений и отображение их – это не такая уж простая задача. Есть много разных юнитов (Год, Месяц, День, Час и так далее) и – что больше всего тревожит – разные системы исчисления, ни одна из которых не является десятичной. Но не нужно отчаиваться. Здесь вам поможет Moment.js! Маленькая js-библиотека, укомплектованная множеством удобных функций для вычисления временных промежутков, конвертирования международных форматов времени и для оформления результата. Кроме того, Moment.js работает с разными языками и часовыми поясами.

Форматируем временные значения быстро и просто

После того как вы встроили эту миниатюрную библиотеку в головную секцию вашего HTML-документа, все что вам остается сделать, это добавить одну строку javascript-кода, чтобы активировать свойства Moment.js. Если вам нужно использовать библиотеку на языке отличном от английского, вам нужно будет включить соответствующий языковой файл:

moment().lang("de");
moment().format("Do MMMM. YYYY");

В нашем примере мы изменяем язык на немецкий (de). Вторая строка форматирует результат соответствующим образом, и отображает его на немецком языке. Аббревиатуры должны быть вам уже знакомы, если вы когда-нибудь пользовались функциями даты и времени. У нас здесь М отвечает за месяц без нуля, ММ за месяц с первым нулем, и ММММ указывает полное название месяца. Значение Do отображает день в виде значения. На сайтах с немецким языком это даст в результате дополнительно период сразу после значения. В английском языке все будет по-другому. Здесь мы добавляем буквы после чисел: 1st, 2nd, 3rd и так далее. Есть языки с более сложным указанием дат.

Moment.js не ограничен форматированием текущего времени, но позволяет форматировать бесконечное значение, которое вам нужно обрабатывать:

moment("01-31-2013, "DD-MM-YYYY").format("Do MMMM. YYYY"); // 31. Januar 2013

Moment.js способен валидировать значения дат. Когда библиотека обнаруживает запись, которую невозможно отобразить в виде времени, вам возвращается значение false:

moment("01-32-2013", "MM-DD-YYYY").isValid(); // false

Подсчет временных промежутков

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

moment().add("days", 7).add("months", 1);

В данном примере мы добавляем 7 дней и один месяц к текущей дате. Результат форматируется при помощи format(). Конечно же, вы также можете использовать subtract().

Если вам нужно отображать временные значения в отношении к текущему времени, возможно для того, чтобы отобразить отсчет до какого-то события, Moment.js предлагает вам воспользоваться функцией fromNow():

moment("01-31-2013, "DD-MM-YYYY").fromNow();

В зависимости от того, насколько далеко простирается высчитанный период времени, Moment.js отображает значения в годах, месяцах, днях, часах и даже минутах. Вместо простого отображения даты, Moment.js отображает семантические значения «3 дня назад», «вчера».

Функция humanizeDuration() отображает фиксированные промежутки времени следующим образом:

moment.humanizeDuration(-1, "minutes", true); // one minute ago

Подытожим

Moment.js позволяет абсолютно без усилия производить вычисления времени. Это полноценное решение, в котором рамки вашей фантазии достигаются гораздо раньше, чем рамки возможностей инструмента. Этот инструмент не позволит вам застопориться на какой-то задаче. Рекомендуем вам внести Moment.js в ваш ежедневный набор инструментов. Так как он распространяется под лицензионным соглашением MIT, тут и думать нечего!

Добавить комментарий

Нам важно знать ваше мнение. Оставьте свой отзыв или ответ

    • bowtiesmilelaughingblushsmileyrelaxedsmirk
      heart_eyeskissing_heartkissing_closed_eyesflushedrelievedsatisfiedgrin
      winkstuck_out_tongue_winking_eyestuck_out_tongue_closed_eyesgrinningkissingstuck_out_tonguesleeping
      worriedfrowninganguishedopen_mouthgrimacingconfusedhushed
      expressionlessunamusedsweat_smilesweatdisappointed_relievedwearypensive
      disappointedconfoundedfearfulcold_sweatperseverecrysob
      joyastonishedscreamtired_faceangryragetriumph
      sleepyyummasksunglassesdizzy_faceimpsmiling_imp
      neutral_faceno_mouthinnocent

Комментариев 0

Новые обсуждения на Форуме