Вывод время и даты в javascript. TempusJS — работаем с датой в javascript. Получить текущий месяц
Для работы с датой и временем в JavaScript существует специальный объект - Date. Этот объект поддерживается практически всем версиями JavaScript, а зачит им можно пользоваться не оглядываясь на проблемы совместимости.
Дата и время в объекте Date хранятся не в явном виде, а как и в большинстве языков программирования - в виде количества миллисекунд, прошедших с дня рождения Unix, т.е. с 0 часов 0 минут 1 января 1970 года. Отличительная особенность объекта Date - все диапазонные значения имеют индексы, начинающиеся с нуля. Это означает, что январь будет иметь индекс 0 (месяц №0), а декабрь будет не двенадцатым, а одиннадцатым месяцем. То же самое справедливо и для дней недели, часов, минут и пр.
Создать объект Date очень просто:
// текущая дата-время var date = new Date(); // дата-время из строки или числа var date = new Date(дата); // дата-время из отдельных значений var date = new Date(год, месяц, день, час, минута, секунда, миллисекунда);
Объект Date обладает рядом очень полезных методов, позволяющих работать с отдельными компонентами даты-времени, а так же проводить проверку коррестности и правильный вывод даты в заданном формате.
| Методы получения компонентов даты-времени | |
| getFullYear | Возвращает год (например, 2011). |
| getYear | Возвращает год. Назначение метода getYear аналогично назначению getFullYear, однако данный метод является устаревшим и не рекомендуются к использованию, т.к. результаты его работы не однозначны: для диапазона дат от 1900 до 1999 года метод возвращает номер года в столетии (двузначный, например 77), а для дат за пределами этого диапазона - возвращается полное значение (четырёхзначное, например 2009). |
| getMonth | Возвращает месяц. |
| getDate | Возвращает день месяца (число в месяце). |
| getHours | Возвращает час. |
| getMinutes | Возвращает минуту. |
| getSeconds | Возвращает секунду. |
| getMilliseconds | Возвращает миллисекунду. |
| getDay | Возвращает номер деня недели. |
| getTime | Возвращает миллисекундное смещение, хранимое объектом. |
| Методы изменения компонентов даты-времени | |
| setFullYear | Устанавливает год. |
| setYear | Устанавливает год. Назначение метода setYear аналогично назначению setFullYear, однако данный метод является устаревшим и не рекомендуются к использованию (так же как и метод getYear). |
| setMonth | Устанавливает месяц. |
| setDate | Устанавливает дату в месяце (день месяца). |
| setHours | Устанавливает час. |
| setMinutes | Устанавливает минуту. |
| setSeconds | Устанавливает секунду. |
| setMilliseconds | Устанавливает миллисекунду. |
| setTime | Устанавливает миллисекундное смещение относительно 00:00:00 01.01.1970 |
| Фунции форматирования и вывода даты-времени | |
| toString | Возвращает строковое представление даты и времени. |
| toUTCString | Возвращает строковое представление даты и времени с пересчётом на время UTC. Формат возвращаемой строки учитывает все интернет-стандарты. |
| toGMTString | Возвращает строковое представление даты и времени с пересчётом на время GMT (время по Гринвичу). Формат возвращаемой строки учитывает все интернет-стандарты. |
| toLocaleString | Аналог toString, но возвращает строковое представление даты и времени, отформатированное в соответствии с настройками локализации данного пользователя. |
| toTimeString | Возвращает строковое представление времени (строка содержит только время). |
| toDateString | Возвращает строковое представление даты (строка содержит только дату). |
| toLocaleTimeString | Аналог toTimeString, но возвращает строковое представление времени, отформатированное в соответствии с настройками локализации пользователя. |
| toLocaleDateString | Аналог toDateString, но возвращает строковое представление даты, отформатированное в соответствии с настройками локализации пользователя. |
| Дополнительные функции | |
| getTimezoneOffset | Возвращает смещение локального времени на компьютере пользователя относительно времени UTC. Смещение возвращается в минутах. |
| parse | Функция позволяет проверить корректность даты-времени, записанных в виде строки. Если строка корректная - сразу будет создан объект Date. |
Так же объект Date содержит ряд методов для работы с UTC-датами. Эти функции полностью аналогичны уже рассмотреным, но содержат в имени префикс "UTC" и работают только с "универсальным" временем: getUTCSeconds, setUTCFullYear и т.д.
Рассмотрим пример работы с датами:
var tmp = new Date(now.getTime()); var arrNames = new Array("Сегодня", "Завтра", "Через 1 год 6 месяцев 15 дней"); var arrNormal = new Array(); var arrLocal = new Array(); var arrUTC = new Array(); // сейчас arrLocal = tmp.toLocaleString(); arrNormal = tmp.toString(); arrUTC = tmp.toUTCString(); // завтра tmp.setDate(tmp.getDate() + 1); arrLocal = tmp.toLocaleString(); arrNormal = tmp.toString(); arrUTC = tmp.toUTCString(); // через 1 год 6 месяцев 15 дней tmp.setFullYear(tmp.getFullYear() + 1); tmp.setMonth(tmp.getMonth() + 6); tmp.setDate(tmp.getDate() + 15); arrLocal = tmp.toLocaleString(); arrNormal = tmp.toString(); arrUTC = tmp.toUTCString(); // выводим результаты в таблицу document.write("
| Дата | " + "Локализованная | " + "Не локализованная | " + "UTC |
| " + arrNames[i] + " | + "" + arrLocal[i] + " | + "" + arrNormal[i] + " | + "" + arrUTC[i] + " | + "
А вот результат работы этого скрипта:
Как видите, представление даты существенно отличается в зависимости от используемого формата. Поэтому при работе с датой-временем надо придерживаться нескольких простых правил:
1. По возможности пользоваться UTC или GMT-форматами. Особенно это важно при создани распределённых решений (например, клиентов платёжных систем). Использование общего опорного времени даст вам гарантии (пусть и не стопроцентные), что и вы и ваш удалённый партнёр будете одинаково интерпретировать получаемые данные.
2. Локализованные дату и время имеет смысл использовать только при выводе их пользователю. Во всех остальных случаях от локализованных данных лучше отказаться.
3. Если всё же приходится использовать локальные дату и время - не забывайте учитывать смещение локального времени относительно опорного (UTC или GMT).
Следование этим правилам избавит вас от большинства логических багов и недочётов, а значит сделает ваш код более стабильным и качественным.
Объект Date позволяет работать с датами и временем. Для создания нового объекта Date используется следующий синтаксис:
New Date()
Даты хранятся в нём как количество миллисекунд, прошедших с полуночи 1 января 1970 г. согласно единому всемирному времени (UTC). Благодаря такому формату с помощью Date можно точно представлять даты, отстоящие от 1 января 1970 г. на 285616 лет.
Если конструктор Date вызывается без аргументов, создаётся объект с текущими значениями даты и времени. Для создания объекта Date с определенной датой или временем, необходимо будет передать один из четырех возможных параметров:
- миллисекунды: значение должно быть числом миллисекунд с 01.01.1970 var birthDate = new Date(8298400000); document.write(birthDate);
- строка с датой: любая дата в формате поддерживаемом методом parse() var birthDate = new Date("April 16, 1975"); document.write(birthDate);
- год, месяц, день
var birthDate = new Date(1975, 4, 28);
document.write(birthDate);
Обратите внимание, что число 4 соответствует маю месяцу. Это значит, что январю соответствует число 0. Аналогичным образом вычисляются и дни, только нулю в этом случае соответствует воскресенье.
- год, месяц, день, час, минуты, секунды, миллисекунды
При работе с объектом Date важно помнить, что вычисления выполняются с использованием единого всемирного времени (UTC), несмотря на то, что ваш компьютер может отображать время в соответствии с вашей временной зоной.
Методы| getDate() | Возвращает день месяца (от 1 до 31) для указанной даты по местному времени. |
| getDay() | Возвращает день недели (от 0 до 6; 0 = воскресенье, 1 = понедельник и т.д.) для указанной даты по местному времени.. |
| getFullYear() | Возвращает год (четыре цифры). |
| getHours() | Возвращает час (от 0 до 23). |
| getMilliseconds() | Возвращает миллисекунды (от 0 до 999). |
| getMinutes() | Возвращает минуты (от 0 до 59). |
| getMonth() | Возвращает месяц (от 0 до 11; 0 = январь, 1 = февраль и т.д.). |
| getSeconds() | Возвращает секунды (от 0 до 59). |
| getTime() | Возвращает количество миллисекунд, прошедших с полуночи 01.01.1970. |
| getTimezoneOffset() | Возвращает разницу во времени между временем UTC и местным временем, в минутах. |
| getUTCDate() | Возвращает день месяца по всемирному времени (от 1 до 31). |
| getUTCDay() | Возвращает день недели по всемирному времени (от 0 до 6). |
| getUTCFullYear() | Возвращает год по всемирному времени (четыре цифры). |
| getUTCHours() | Возвращает час по всемирному времени (от 0 до 23). |
| getUTCMilliseconds() | Возвращает миллисекунды по всемирному времени (от 0 до 999). |
| getUTCMinutes() | Возвращает минуты по всемирному времени (от 0 до 59). |
| getUTCMonth() | Возвращает месяц по всемирному времени (от 0 до 11). |
| getUTCSeconds() | Возвращает секунды по всемирному времени (от 0 до 59). |
| parse() | Анализирует строку даты (например, "21 мая 1992 года") и возвращает строку со значением даты, которая содержит число в миллисекундах с 1 января 1970 00:00:00. |
| setDate() | Устанавливает день месяца для указанной даты по местному времени (от 1 до 31). |
| setFullYear() | Устанавливает год (четыре цифры). |
| setHours() | Устанавливает часы для указанной даты по местному времени (от 0 до 23). |
| setMilliseconds() | Устанавливает миллисекунды для указанной даты по местному времени. |
| setMinutes() | Устанавливает минуты (от 0 до 59). |
| setMonth() | Устанавливает месяц (от 0 до 11). |
| setSeconds() | Устанавливает секунды (от 0 до 59). |
| setTime() | Устанавливает дату в миллисекундах после (или до) 01.01.1970. |
| setUTCDate() | Задает день месяца. |
| setUTCFullYear() | Устанавливает год по всемирному времени (четыре цифры). |
| setUTCHours() | Устанавливает час для указанной даты по всемирному времени. |
| setUTCMilliseconds() | Задает миллисекунды для указанной даты по всемирному времени. |
| setUTCMinutes() | Устанавливает минуты для указанной даты по всемирному времени. |
| setUTCMonth() | Задает месяц для указанной даты по всемирному времени. |
| setUTCSeconds() | Устанавливает секунды для указанной даты по всемирному времени. |
| toDateString() | |
| toISOString() | Преобразует дату в строку, используя стандарт ISO 8601. |
| toJSON() | Возвращает дату в виде строки, отформатированную как дата JSON. |
| toLocaleDateString() | |
| toLocaleTimeString() | Возвращает часть даты в виде строки, с представлением даты на основе параметров системы. |
| toLocaleString() | Возвращает дату в виде строки, с представлением даты на основе параметров системы. |
| toString() | Возвращает строку, представляющую указанный объект Date. |
| toTimeString() | Возвращает часть даты в виде строки. |
| toUTCString() | Преобразует дату в строку, используя часовой пояс UTC. |
| UTC() | Принимает те же параметры, что и длинная форма конструктора (т.е. 2-7) и возвращает количество миллисекунд с 1 января 1970, 00:00:00 UTC. |
| valueOf() | Возвращает примитивное значение объекта Date. |
На этом уроке мы познакомимся с объектом Date языка JavaScript и научимся его использовать на практике.
Создание даты – 4 примераВ JavaScript создание даты осуществляется с помощью объекта Date . Объект Date представляет собой точку на оси времени и предназначен для хранения даты и времени с точностью до миллисекунды.
Примеры создания даты в JavaScript.
1. Создание текущей даты и времени.
Получить текущую дату и время в JavaScript осуществляется посредством создания экземпляра объекта Date без указания параметров:
// текущая дата (дата и время, которая была в момент создания экземпляра объекта Date на локальном компьютере пользователя) var now = new Date(); // например, выведем текущую дату в консоль console.log(now);
Если нужно получить только сегодняшнюю дату в формате строки, то можно воспользоваться методом toLocaleDateString:
Var now = new Date().toLocaleDateString(); // 19.12.2019
Текущее время пользователя можно получить так:
Var now = new Date().toLocaleTimeString(); // 11:02:48 var now = new Date().toLocaleTimeString().slice(0,-3); // 11:02
Дату и время в формате строки можно получить следующим образом:
Var now = new Date().toLocaleString(); // 19.12.2019, 11:02:48
2. Создание даты путём указания объекту Date количества миллисекунд, прошедших с 1 января 1970 00:00:00 UTC.
// 1 год (не высокосный) = 365*24*60*60*1000 = 31536000000 мс // например, создадим дату 01.01.1971, 00:00:00 по UTC: var date1 = new Date(31536000000);
3. Создание даты посредством указания её объекту Date в виде строки.
При этом варианте создания даты JavaScript попытается понять переданную ей строку и сформировать на основе её дату. Преобразование строки в дату в JavaScript осуществляется с помощью метода Date.parse .
Например:
// создание даты на основе строки в формате DD.MM.YY var date1 = new Date("05.11.19"); // создадим дату на основе строки в формате YYYY-MM-DDThh:mm:ss.sss (символ T используется для разделения даты и времени) var date2 = new Date("2015-02-24T21:23"); // создадим дату на основе строки с указанием часового пояса (формат YYYY-MM-DDThh:mm:ss.sss±hh:mm): var date3 = new Date("2015-02-24T22:02+03:00");
4. Создание даты посредством указания следующих параметров через запятую: год (4 цифры), месяц (отсчёт ведётся с 0), день (1..31), часы (0..23), минуты (0..59), секунды (0..59), миллисекунды (0..999). Причём обязательными из них являются только первые два параметра.
Пример создания даты с указанием только обязательных параметров:
// создадим дату 01.01.2015 (неуказанные параметры по умолчанию равны: число - 01, часы - 00, минуты - 00, секунды - 00, миллисекунды – 000). var date1 = new Date(2015,01); // создадим дату 24.01.2015, 21:23 var date2 = new Date(2015,01,24,21,23);
Примечание: Если Вам необходимо установить дату и время в UTC, то можно воспользоваться методом Date.UTC .
//1 пример var date1 = Date.UTC(2015,1,1); var date2 = new Date(date1); alert(date2.toUTCString()); //2 пример var newDate = new Date(Date.UTC(2015,1,1)); alert(newDate.toUTCString());
Получение отдельных компонентов даты и времениВ JavaScript для получения отдельных компонентов даты и времени предназначены следующие методы:
- getFullYear() – возвращает год, состоящий из 4 чисел;
- getMonth() – возвращает месяц в формате числа от 0 до 11 (0 – январь, 1 – февраль, 2 – март, ..., 11 – декабрь);
- getDate() – возвращает число месяца от 1 до 31;
- getHours() – возвращает количество часов от 0 до 23;
- getMinutes() – возвращает количество минут от 0 до 59;
- getSeconds() – возвращает количество секунд от 0 до 59;
- getMilliseconds() – возвращает количество миллисекунд от 0 до 999.
Все эти методы возвращают отдельные компоненты даты и времени в соответствии с часовым поясом установленном на локальном устройстве пользователя.
// создадим дату 11.11.2019 00:00 по UTC var newDate = new Date(Date.UTC(2019,11,11)); // получим компоненты даты, если на устройстве пользователя местное время равно UTC+10:00 newDate.getFullYear(); //2019 newDate.getMonth(); // 10 newDate.getDate(); // 11 newDate.getHours(); // 10 newDate.getMinutes(); // 0 newDate.getSeconds(); // 0 newDate.getMilliseconds(); // 0
Пример, в котором поприветствуем пользователя в зависимости от того какой сейчас у него интервал времени:
// получим текущее время пользователя и компоненты этого времени var now = new Date(), hour = now.getHours(), minute = now.getMinutes(), second = now.getSeconds(), message = ""; // определим фразу приветствия в зависимости от местного времени пользователя if (hour
