Дата и время также важны во многих программах JavaScript. Вот почему в JavaScript есть встроенный объект Date для обработки дат. Объекты Dates содержат число, представляющее миллисекунды с января 1970 года по всемирному координированному времени (время эпохи Linux).
С помощью объекта Date мы можем многое делать для управления датами. Однако у него много причуд и недостающих функций. Поэтому сторонние библиотеки во многих случаях лучше справляются с обработкой дат, чем с использованием встроенного объекта Date. Moment.js - один из самых популярных, поэтому, естественно, он является первым выбором, когда нам нужно манипулировать датами в JavaScript.
Встроенный объект даты
Чтобы работать с датами в JavaScript, мы должны создать объект new Date. Конструктор объекта даты принимает ноль или более аргументов. Если аргументы не переданы, то созданный объект Date будет иметь текущую дату и время в вашем часовом поясе на момент создания экземпляра.
Параметры, которые он может принимать, включают строку даты, другой объект даты или (годы, индекс месяца, день, час, минуты, секунды и миллисекунды) вместе. Мы можем передать строку даты конструктору даты следующим образом:
new Date('2019-01-01');
Если мы зарегистрируем результат, мы получим ‘Mon Dec 31 2018 16:00:00 GMT-0800 (Pacific Standard Time)’, поскольку дата хранится в формате UTC, а браузер работает на компьютере в тихоокеанском часовом поясе, который на 8 часов отстает от UTC на 1 января 2019 года, когда это стандартное тихоокеанское время.
Как мы видим, передача строки даты конструктору Date сбивает с толку. Разные браузеры по-разному анализируют строки даты. Точно так же метод Date.parse не следует использовать для синтаксического анализа строк даты. Мы видим, что строки, содержащие только дату, такие как та, которую мы передали, обрабатываются как всемирное координированное время, а не местное время.
Если мы хотим передать объект Date в конструктор, мы можем написать:
new Date(new Date());
Когда мы регистрируем результат, мы получаем что-то вроде «Вс, 20 октября 2019, 10:57:58 GMT-0700 (Тихоокеанское летнее время)». Это указано в вашем местном времени.
Мы можем передать в конструктор год, индекс месяца, день, час, минуты, секунды и миллисекунды. Требуются только год и месяц. Итак, мы можем написать что-то вроде:
new Date(2019,0,1,0,0,0,0)
Это вернет «Вт, 1 января 2019, 00:00:00 GMT-0800 (стандартное тихоокеанское время)», если мы его зарегистрируем. Обратите внимание, что у нас есть 0 во втором аргументе конструктора. Второй аргумент - это индекс месяца, который равен 0 для января, 1 для февраля и т. Д. Так что декабрь будет 11 декабря. Остальные аргументы - это то, что мы ожидаем. Первое - год, третье - день, четвертое - часы, пятое - минуты, шестое - секунды и последнее - миллисекунды.
Мы можем преобразовать объект Date в метку времени UNIX, которая представляет собой количество миллисекунд с 1 января 1970 года по всемирному координированному времени с помощью унарного оператора +, поэтому, если мы напишем:
+new Date(2019,0,1,0,0,0,0)
Мы получаем 1546329600000, когда регистрируем вывод, потому что он приводит дату к числу.
Другой способ получить метку времени - использовать метод .getTime().
Чтобы изменить отдельные компоненты объекта Date, например установить часы или день, или получить компоненты Date, такие как день недели или день месяца, существуют методы для этого в объекте Date.
Методы в объекте Date
В объекте Date есть методы для получения и установки частей дат, а также преобразования времени в UTC или установки смещения часового пояса. Некоторые важные методы объекта Date включают следующее:
Date.now ()
Возвращает текущее время в виде отметки времени UNIX с игнорированием дополнительных секунд. Этот метод статический.
Дата.UTC ()
Возвращает текущее время в виде отметки времени UNIX с игнорированием дополнительных секунд. Этот метод статический. Он принимает те же аргументы, что и самый длинный список аргументов для конструктора Date, который представляет собой год, индекс месяца, день, час, минуты, секунды и миллисекунды, но требуются только год и месяц. Мы можем использовать это как в следующем коде:
Date.UTC(2019,0,1,1,0,0,0)
Мы возвращаем что-то вроде 1546304400000.
Функции получения
Date.getDate ()
Возвращает день месяца по местному времени. Например, если у нас есть:
const date = new Date(2019,0,1,0,0,0,0); console.log(date.getDate());
Мы получили бы 1, поскольку мы указали его как день месяца в аргументах конструктора.
Date.getDay ()
Возвращает день недели (0–6) для указанной даты по местному времени, где 0 - воскресенье, 6 - суббота, а 1–5 - дни между ними. Например, мы можем написать:
const date = new Date(2019,0,1,0,0,0,0); console.log(date.getDay());
Тогда мы получим 2, то есть вторник.
Date.getFullYear ()
Возвращает 4-значный год указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019,0,1,0,0,0,0); console.log(date.getFullYear());
Тогда мы получим 2019 год, который представляет собой год date из 4 цифр.
Date.getHours ()
Возвращает час (0–23) указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019,0,1,0,0,0,0); console.log(date.getHours());
Затем мы получаем 0, который мы указали в аргументе часов в конструкторе.
Дата. getMilliseconds ()
Возвращает миллисекунды указанной даты от 0 до 999 по местному времени. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getMilliseconds());
Это получает миллисекунды, указанные в объекте date, который должен возвращать 0, как мы указали в конструкторе.
Date.getMinutes ()
Возвращает минуты (0–59) указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getMinutes());
Тогда у нас получится 0 минут, как мы указали в конструкторе.
Date.getMonth ()
Возвращает месяц (от 0 для января до 11 для декабря) указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getMonth());
Тогда мы получим месяц 0 для января, как мы указали в конструкторе.
Date.getSeconds ()
Возвращает секунды (0–59) указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getSeconds());
Тогда у нас получится 0 секунд, как мы указали в конструкторе.
Date.getTime ()
Возвращает временную метку UNIX для указанной даты, которая представляет собой количество миллисекунд с 1 января 1970 года 00:00:00 UTC. В прежнее время он будет отрицательным. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getTime());
Затем мы получаем 1546329600000, возвращенное функцией getTime(). Сокращением для этого является использование унарного оператора +, как в следующем коде:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(+date);
Если мы запустим приведенный выше код, мы получим тот же результат в журнале.
Date.getTimezoneOffset ()
Возвращает смещение часового пояса в минутах для текущего местоположения, установленного на вашем хост-устройстве. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getTimezoneOffset());
Тогда мы получим 480, если ваше хост-устройство настроено на тихоокеанский часовой пояс, поскольку 1 января 2019 года тихоокеанский часовой пояс на 8 часов отстает от UTC, поэтому мы получаем, что смещение часового пояса составляет 480 минут, что составляет 8 часов.
Date.getUTCDate ()
Возвращает день месяца от 1 до 31 указанной даты по всемирному координированному времени. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getUTCDate());
Получаем 1, так как в качестве даты указали 1 января 2019 г.
Date.getUTCDay ()
Вернуть день недели от 0 до 6 согласно указанной дате в UTC. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getUTCDay());
Тогда мы получим 2, потому что 1 января 2019 года - вторник.
Date.getUTCFullYear ()
Вернуть год из 4 цифр в указанную дату по всемирному координированному времени. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getUTCFullYear());
Мы получаем 2019, так как это то, что мы указали в конструкторе даты.
Date.getUTCHours ()
Вернуть часы с 0 до 23 указанной даты по всемирному координированному времени. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getUTCHours());
Если для языкового стандарта задан тихоокеанский часовой пояс, мы получим 8, поскольку мы указали, что час равен 0 по местному времени, что совпадает с 8 по UTC 1 января 2019 года.
Date.getUTCMilliseconds ()
Возвращает миллисекунды указанной даты от 0 до 999 по всемирному координированному времени. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getUTCMilliseconds());
Это получает миллисекунды, указанные в объекте date, который должен возвращать 0, как мы указали в конструкторе.
Date.getUTCMonth ()
Вернуть месяц от 0 для января до 11 для декабря в указанное время по всемирному координированному времени. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getUTCMonth());
Это получает месяц, указанный в объекте date, который должен возвращать 0, как мы указали в конструкторе.
Date.getUTCSeconds ()
Возвращает секунды (0–59) указанной даты в формате UTC. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getUTCSeconds());
Тогда у нас получится 0 секунд, как мы указали в конструкторе.
Date.getYear ()
Возвращает год, который обычно состоит из 2–3 цифр указанной даты в соответствии с местным часовым поясом.
const date = new Date(2019, 0, 1, 0, 0, 0, 0); console.log(date.getUTCSeconds());
Тогда получим 119 за 2019 год.
Если вместо этого у нас есть:
const date = new Date(1900, 0, 1, 0, 0, 0, 0); console.log(date.getYear());
Получаем 0 для 1900. И если у нас есть:
const date = new Date(2000, 0, 1, 0, 0, 0, 0); console.log(date.getYear());
Тогда мы получаем 100 для 2000. Итак, 1900 - это год 0 согласно методу getYear(). Гораздо лучше использовать метод getFullYear() для получения правильного года из объекта Date.
Функции установки
Существуют также соответствующие функции-установщики для каждой из упомянутых выше функций-получателей. У нас есть следующие функции установки для объекта Date:
Date.setDate ()
Устанавливает день месяца по местному времени. Например, если у нас есть:
const date = new Date(2019,0,1,0,0,0,0); date.setDate(2) console.log(date);
Мы получим «среда, 2 января 2019 года, 00:00:00 GMT-0800 (стандартное тихоокеанское время)», когда на хост-устройстве установлен тихоокеанский часовой пояс, поскольку мы указали 2 в функции setDate.
Date.setFullYear ()
Устанавливает 4-значный год указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019,0,1,0,0,0,0); date.setFullYear(2020) console.log(date.getFullYear());
Тогда мы получим 2020 год, который представляет собой год date из 4 цифр.
Date.setHours ()
Устанавливает час (0–23) указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019,0,1,0,0,0,0); date.setHours(3) console.log(date.getHours());
Затем мы получаем 3, когда вызываем getHours, что мы указали в аргументе часов в функции setHours.
Дата. setMilliseconds ()
Устанавливает миллисекунды указанной даты от 0 до 999 по местному времени. Например, мы можем написать:
const date = new Date(2019,0,1,0,0,0,0); date.setMilliseconds(3) console.log(date.getMilliseconds());
Это устанавливает миллисекунды, указанные в объекте date, который должен вернуть 3, как мы указали в функции setMilliseconds, когда мы вызываем функцию getMilliseconds.
Date.setMinutes ()
Устанавливает минуты (0–59) указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setMinutes(20) console.log(date.getMinutes());
Затем мы получаем 20 минут, возвращенных из getMinutes(), как мы указали в функции setMinutes.
Date.setMonth ()
Устанавливает месяц (от 0 для января до 11 для декабря) указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setMonth(3) console.log(date.getMonth());
Затем мы получаем месяц 3, возвращенный из getMonth() после того, как мы установили его setMonth()
Date.setSeconds ()
Устанавливает секунды (0–59) указанной даты по местному времени. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setSeconds(10); console.log(date.getSeconds());
Затем мы получаем 10 секунд от getSeconds(), как мы указали в функции setSeconds.
Date.setTime ()
Устанавливает временную метку UNIX для указанной даты, которая представляет собой количество миллисекунд с 1 января 1970 года 00:00:00 UTC. В прежнее время он будет отрицательным. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setTime(100) console.log(date.getTime());
Затем мы получаем 100, возвращаемое функцией getTime(), поскольку мы установили его на 100 с помощью setTime.
Date.setUTCDate ()
Устанавливает день месяца от 1 до 31 в указанную дату по всемирному координированному времени. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setUTCDate(2) console.log(date.getUTCDate(2));
Мы получаем 2, так как мы указали 2 в setUTCDate
Date.setUTCFullYear ()
Устанавливает 4-значный год в указанной дате по всемирному координированному времени. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setUTCFullYear(2020) console.log(date.getUTCFullYear());
Мы получаем 2020 с getUTCFullYear(), поскольку это то, что мы указали в функции даты setUTCFullYear().
Date.setUTCHours ()
Устанавливает часы от 0 до 23 указанной даты по всемирному координированному времени. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setUTCHours(2) console.log(date.getUTCHours());
Мы получаем 2 с getUTCHours(), поскольку мы указали это при вызове setUTCHours().
Date.setUTCMilliseconds ()
Устанавливает миллисекунды указанной даты от 0 до 999 по всемирному координированному времени. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setUTCMilliseconds(10) console.log(date.getUTCMilliseconds());
Это получает миллисекунды с getUTCMilliseconds(), который должен вернуть 10, как мы указали в setUTCMilliseconds().
Date.setUTCMonth ()
Вернуть месяц от 0 для января до 11 для декабря в указанное время по всемирному координированному времени. Например, если мы напишем:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setUTCMonth(3); console.log(date.getUTCMonth());
Это получает месяц, указанный в объекте date, который должен вернуть 3 из getUTCMonth(), как мы указали в вызове setUTCMonth().
Date.setUTCSeconds ()
Устанавливает секунды (0–59) указанной даты в формате UTC. Например, мы можем написать:
const date = new Date(2019, 0, 1, 0, 0, 0, 0); date.setUTCSeconds(10); console.log(date.getUTCSeconds());
Затем мы получаем 10 секунд, когда мы вызывали getUTCSeconds(), поскольку мы указывали в 10, когда мы вызывали setUTCSeconds().
Метод setYear() устанавливает значение ye. Гораздо лучше использовать метод setFullYear() для получения правильного года из объекта Date.
У объекта Date есть несколько ограничений. Например, он не поддерживает часовые пояса. Это создает проблемы, когда нам нужны данные о часовых поясах в наших датах. Даты JavaScript поддерживают только местный часовой пояс, UTC или смещение часового пояса относительно UTC. При работе с объектами даты разрешены только некоторые преобразования между этими часовыми поясами. Например, при преобразовании объектов Date в строку даты мы можем выбирать только местное время и UTC. Объект JavaScript Date хранит даты в формате UTC внутри себя.
Moment.js
Управление временем и датой в JavaScript болезненно из-за ограничений, которые мы обсуждали выше. Даже с функциями, доступными с Date объектами, есть много шансов для ошибок и ошибок. Также нет функций для форматирования времени и даты, что является большой проблемой. Чтобы решить эту проблему, мы используем moment.js. Это лучшая библиотека для работы со временем.
Собственные объекты даты JavaScript имеют проблемы с часовыми поясами, когда даты YYYY-MM-DD анализируются по времени UTC, а не по местному времени. Это создает ошибки для разработчиков, которые не знают об этой проблеме. См. Https://stackoverflow.com/questions/29174810/javascript-date-timezone-issue
Также есть различия в поддержке частей дат в разных браузерах. (См. Https://stackoverflow.com/questions/11253351/javascript-date-object-issue-in-safari-and-ie)
Также сложно добавлять и вычитать временные метки с помощью встроенных функций даты. Невозможно сделать это без написания большого количества кода и выполнения множества проверок. Также нет возможности сравнить 2 раза.
Форматирование дат также невозможно без написания собственного кода для использования сторонних библиотек.
Moment.js решает все эти проблемы, предоставляя встроенные функции для выполнения всех этих общих операций. Он предоставляет функции для синтаксического анализа и форматирования дат.
Конструктор moment - это то место, где вы можете передать строку даты, и будет создан объект moment. Например, вы можете передать:
moment('2019-08-04')
Вы получите moment, который вы можете сравнить с другими moment объектами, и добавить или вычесть их с разными временными интервалами.
Если вы ничего не передаете конструктору moment, вы получите текущую дату и время.
Также нужен второй аргумент. Если вы хотите убедиться, что дата обрабатывается как дата ГГГГ-ММ-ДД, напишите moment(‘2019–08–04’, 'YYYY-MM-DD'). Если вы не знаете формат даты или времени, вы можете передать массив возможных форматов, и Moment выберет правильный:
moment('2019–08–04', ['YYYY-MM-DD', 'DD-MM-YYYY']);
После создания объекта Moment вы можете делать много вещей, например форматировать даты:
const a = moment('2019–08–04', 'YYYY-MM-DD').format('MMMM Do YYYY, h:mm:ss a');
console.log(a);// August 4th 2019, 12:00:00 am
const b = moment('2019–08–04', 'YYYY-MM-DD').format('dddd');
console.log(b);// Sunday
const c = moment('2019–08–04', 'YYYY-MM-DD').format("MMM Do YY");
console.log(c);// Aug 4th 19
const d = moment('2019–08–04', 'YYYY-MM-DD').format('YYYY [escaped] YYYY');
console.log(d);// 2019 escaped 2019
const e = moment('2019–08–04', 'YYYY-MM-DD').format();
console.log(e);// 2019-08-04T00:00:00-07:00
Из приведенных выше примеров мы видим, что можем форматировать даты практически так, как захотим.
Мы также можем определить, какой промежуток времени одна дата относительно другой даты, написав:
const augDate = moment('2019–08–04', 'YYYY-MM-DD');
const sepDate = moment('2019–09–04', 'YYYY-MM-DD');
console.log(augDate.from(sepDate)); // a month ago
Мы также можем добавлять или вычитать даты моментов:
const augDate = moment('2019–08–04', 'YYYY-MM-DD');
const sepDate = moment('2019–09–04', 'YYYY-MM-DD');
console.log(augDate.add(10, 'days').calendar()); // 08/14/2019
console.log(augDate.subtract(10, 'days').calendar()); // 07/25/2019
Легко сравнить 2 даты:
moment('2010-01-01').isSame('2010-01-01', 'month'); // true
moment('2010-01-01').isSame('2010-05-01', 'day'); // false, different month
moment('2008-01-01').isSame('2011-01-01', 'month'); // false, different year
Вы также можете проверить, действует ли для даты летнее время или нет:
const augDate = moment('2019–08–04', 'YYYY-MM-DD');
const decDate = moment('2019–12–04', 'YYYY-MM-DD');
console.log(augDate.isDST()) // true
console.log(decDate.isDST()) // false
И вы можете в любой момент преобразовать дату обратно в дату JavaScript, вызвав функцию toDate() для объекта Moment.
Как мы видим, объект Date в JavaScript имеет ограниченные возможности при работе с датами. Он также не очень хорошо разбирает даты и не имеет возможности легко форматировать даты. Вот почему нам необходимо использовать библиотеки, такие как Moment.js, для заполнения пробелов, чтобы мы могли создавать безошибочный код, который намного проще манипулирует датами.
