Date JS — Дата и время в JavaScript
Для работы с датой и временем в JavaScript существует встроенный объект Date , который содержит методы для создания, хранения, изменения или вывода элементов времени с точностью до миллисекунды. К таким элементам относят: год, месяц, день месяца, неделя, час, минута, секунда, миллисекунда, день недели.
Создать объект Date можно с помощью аргументов:
- количество миллисекунд — new Date(value) ;
- строка — new Date(dateString) ;
- год, месяц, день, часы, минуты, секунды, миллисекунды;
Или пропустить аргументы вовсе.
new Date()
Создадим экземпляр объекта Date без дополнительных аргументов и выведем получившийся результат в console.
let date = new Date(); console.log(date); // Thu Sep 01 2022 06:46:30 GMT+1200 (Фиджи) console.log(date.getFullYear()); // 2022
Получим дату и время согласно часовому поясу, которое установлено на локальном компьютере.
Точно такую же информацию мы можем получить написав Date() без new .
let date = Date(); console.log(date); console.log(date.getFullYear()); // получим ошибку
Однако в этом случае мы получим строку, объект же Date может быть создан только путем вызова функции-конструктора, а следовательно с использованием оператора new . Встроенные методы, для работы с датой в JavaScript, со строкой работать не будут, кроме Date.parse() .
new Date(value)
Создать объект Date , можно передав в качестве аргумента количество миллисекунд.
console.log(new Date(0)); // Thu Jan 01 1970 12:00:00 GMT+1200 (Фиджи) console.log(new Date(818079300000)); // Tue Dec 05 1995 00:15:00 GMT+1200 (Фиджи) console.log(new Date(-268065720000)); // Tue Jul 04 1961 21:18:00 GMT+1200 (Фиджи)
Результат = 1 января 1970 года UTC+0 + количество миллисекунд.
Если указать миллисекунды со знаком минус, отсчет пойдет в обратную сторону. Таким образом все, что со знаком минус будет соответствовать дате до 1 января 1970 года.
getTime()
Количество миллисекунд прошедших с 1 января 1970 года по сегодняшний или заданный момент времени называется timestamp и может быть получено из new Date() с помощью метода getTime() .
date = new Date(2019, 5); alert(date.getTime()); // количество миллисекунд прошедшие с 1 января 1970 года alert(new Date(date.getTime())) // получаем дату обратно
Date.now()
Если необходимо получить количество миллисекунд прошедших с 1 января 1970 года по данный момент правильней будет использовать метод Date.now() .
let date = Date.now(); alert(date);
Запись эквивалента new Date().getTime() , но в отличие от этой конструкции Date.now() не создает промежуточный объект Date , что может быть особенно важно при разработке, где упор идет на быстродействие.
new Date(dateString)
Создать объект Date можно передав в качестве аргумента строку с датой и временем.
date = new Date('2021-09-25T05:27:00'); alert(date); // Sun Sep 25 2022 05:27:00 GMT+1300 (Тонга)
Дата должна быть записана в формате понятном методу Date.parse() , который преобразовывает строку в количество миллисекунд прошедших с 1 января 1970 года UTC+0. Если формат записи будет не верным, метод вернет NaN .
date = new Date('2021-09-25T05:27:00'); alert(Date.parse(date));
new Date(year, month, date, hours, minutes, seconds, millisecond)
new Date(1995, 11, 4, 3, 15, 10, 0); // Mon Dec 04 1995 03:15:10 GMT-0600 (Центральная Америка)
Рассмотрим все возможные аргументы по порядку:
Обязательные аргументы
Год (year) — обязательный аргумент. Обычно записывается полностью — все четыре числа — 2022. Допустима, но не рекомендуется запись от 0 до 99. В этом случае год будет интерпретирован, как 1900 + заданное число.
Месяц (month) — обязательный аргумент и целое число от 0 до 11, где первое это январь, а последнее декабрь.
Необязательные аргументы
День (date) — необязательный аргумент обозначающий день месяца, если не задан, то по умолчанию принимает значение 1. Отсчет начинается с единицы.
Часы (hours) — от 1 до 24
Минуты (minutes) — от 1 до 60
Секунды (seconds) — от 1 до 60
Миллисекунды (millisecond) — от до 1000
Часы, минуты, секунды и миллисекунды — это целые числа, если аргумент не задан, то по умолчанию принимается значение 0.
Если при создании объекта Date в качестве аргумента задано число больше или меньше логического диапазона, программа автоматически переформатирует его в корректное, перенеся значение не соседнее. Если год 2010, а месяц 12 – это будет январь 2011. Если задать 10 часов 61 минуту – это будет 11 часов 1 минута. Если месяц апрель, а день 0 это 31 марта.
Методы для получения элементов даты
getFullYear()
let date = new Date('1996-12-17T05:30:00'); date.getFullYear(); // 1996
Метод позволяет получить год из объекта Date , если аргументов нет вернет текущий.
getMonth()
let date = new Date('1996-12-17T05:30:00'); date.getMonth(); // 11
Метод вернет месяц в формате от 0 до 11, если аргументов нет текущий.
getDate()
let date = new Date('1996-12-17T05:30:00'); date.getDate(); // 17
Метод возвращает день месяца указанного в объекте, если аргументов нет вернет текущую дату по местному времени.
getHours(), getMinutes(), getSeconds(), getMilliseconds()
let date = new Date(1996, 11, 17, 21, 30, 10, 900); date.getHours(); // 21 или 9 часов вечера date.getMinutes(); // 30 минут date.getSeconds(); // 10 секунд date.getMilliseconds(); 900 миллисекунд
Если аргумент отсутствует метод вернёт 0.
getTimezoneOffset()
Метод возвращает разницу в минутах между локальным временем и UTC.
let date = new Date().getTimezoneOffset(); alert(date); // при UTC +3 покажет -180
getDay()
let date = new Date(1996, 11, 17); date.getDay(); // 2
Метод возвращает день недели, отсчет начинается с 0 (воскресенье) и заканчивается 6-ю (суббота). В примере 1996 год 17 декабря и это вторник, следовательно результат 2.
Установка компонентов даты и времени
Для того, чтобы заменить или передать в объект Date отдельные компоненты времени используют следующие методы. В квадратных скобках необязательные элементы, которые при отсутствии игнорируются.
setFullYear(год, [месяц], [день месяца])
setMonth(месяц, [день месяца])
setHours(часы, [минуты], [секунды], [миллисекунды])
setMinutes(минуты, [секунды], [миллисекунды])
setTime() — устанавливает время в Date равным количеству миллисекунд прошедших с 1 января 1970 г. UTC.
При использовании методов результат возвращается в миллисекундах прошедших с 1 января 1970 г. по времени установленном на компьютере.
let date = new Date(2019, 0); // Tue Jan 01 2019 00:00:00 GMT+0300 (Москва) date.setFullYear(2021); // 1609448400000 мс, что равно Fri Jan 01 2021 00:00:00 GMT+0300 (Москва)
В примере мы передали в объект 2021 год, который и заменил 2019-ый.
UTC-варианты методов
Методы получения и передачи элементов для объекта Date работают согласно времени установленном на компьютере. Для того, чтобы в качестве результата получать дату относительно всемирного координированного времени (UTC) используют похожие методы, отличающиеся только вставкой UTC.
Получение элементов даты согласно UTC:
getUTCFullYear() , getUTCMonth() , getUTCDate() , getUTCHours() , getUTCMinutes() , getUTCSeconds() , getUTCMilliseconds() , getUTCDay()
Установка компонентов даты и времени согласно UTC:
setUTCFullYear() , setUTCMonth() , setUTCDate() , setUTCHours() , setUTCMinutes() , setUTCSeconds() , setUTCMilliseconds()
Преобразование объекта Date к строке
Для того, чтобы получить из Date нужные элементы даты и времени в формате строки используют следующие методы:
toString() — дата и время
toTimeString() — только время
toDateString() — только дата
toUTCString() — дата и время в формате UTC
toISOString() — дата и время в формате ISO
toLocaleTimeString() — только время в локальном формате
toLocaleString() — дата и время в локальном формате
let date = new Date(2018, 4, 19, 2, 34, 10); date.toString(); // Sat May 19 2018 02:34:10 GMT+0300 (Москва) date.toTimeString(); // 02:34:10 GMT+0300 (Москва) date.toDateString(); // Sat May 19 2018 date.toUTCString(); // Fri, 18 May 2018 23:34:10 GMT date.toISOString(); // 2018-05-18T23:34:10.000Z date.toLocaleTimeString(); // 02:34:10 date.toLocaleString(); // 19.05.2018, 02:34:10
Итого
1. Объект Date может быть создан без аргументов или с аргументами. В первом случае получим текущую временную метку, во втором задаем нужный отрезок времени с помощью миллисекунд, строки с датой или аргументов (год, месяц, день, часы, минуты, секунды, миллисекунды).
2. Для получения отдельных элементов Date используют методы — getFullYear() , getMonth() , getDate() , getHours() , getMinutes() , getSeconds() , getMilliseconds() , getDay() .
3. Для того, чтобы установить новые компоненты даты и времени используют: setFullYear() , setMonth() , setDate() , setHours() , setMinutes() , setSeconds() , setMilliseconds() , setTime() .
4. Для получения даты в нужном формате в виде строки используют: toString() , toTimeString() , toDateString() , toUTCString() , toISOString() , toLocaleTimeString() , toLocaleString() .
5. При создании Date в независимости какие аргументы и в каком формате передаются, создается объект со всеми элементами времени.
6. Если передать в Date аргументы времени некорректного формата (целые числа), дата будет корректироваться переносом значения на соседнее.
Skypro — научим с нуля
Базовые операции с датами
Создать дату в JavaScript можно с помощью конструктора Date() , который при вызове без параметров ( const date = new Date() ) вернет дату и время вызова в формате YYYY-MM-DDTHH:mm:ss.sssZ где YYYY-MM-DD — год, месяц и день, T — разделитель между датой и временем, HH:mm:ss.sss — часы, минут, секунды и миллисекунды, а Z — настройки временной зоны. Даты в JavaScript представлены в виде количества миллисекунд, прошедших с 1 января 1970 года по UTC поэтому новую дату можно так же создать с помощью метода .now() глобального объекта Date , который вернет количество миллисекунд до вызова.
const date1 = new Date(); //2023-08-29T11:30:31.224Z const date2 = Date.now(); //1693308631228
Поскольку даты содержат точное количество миллисекунд, прошедших с 1 января 1970 года по UTC разницу между ними можно использовать для замера времени между началом и окончанием выполнения какой-либо операции. Для таких целей лучше использовать метод Date.now() вместо конструктора т.к. он гораздо быстрее потому что не создает при вызове промежуточных объектов и возвращает сразу количество миллисекунд, что может быть важно при проведении большого количества замеров подряд.
const start = Date.now(); (function someCalcs() < //какие-то сложные вычисления >)(); console.log(`Время выполнения: $мс`);
Что бы задать конкретную дату нужно передать ее в конструктор в одном из следующих форматов:
- Указать год, месяц, день и т.д. цифрами через запятую
- Строка вида “ YYYY-MM-DDTHH:mm:ss.sssZ” или ‘December 31, 2023 23:59:59’ фактически такой способ является неявным вызовом метода Date.parse()
- Другой объект даты
- Количество миллисекунд, прошедших с 1 января 1970 года по UTC
При указании даты строкой или перечислением цифр не обязательно указывать точное до мс значение. Если не передать количество мс, секунд, минут или часов — они будут автоматически установлены на 0, дни на 1, месяца на 0 (нумерация месяцев начинается с 0). При этом год нужно передавать полностью, а не последние 2 цифры.
Внести изменения в уже существующий объект даты, можно с помощью методов, которые имеют название .set как .setDate() для дней ( .getDay() вернет день недели числом от 0 до 6), .setFullYear() для года ( .setYear() был удален из стандарта т.к. мог принимать не полное значение года) или .setHours() для часов. Если указать при объявлении даты или передать в один из таких методов несуществующее значение, например 20-й месяц или 25-й час — дата автоматически отформатируется и вместо 25 часов добавит к значений дней единицу, а часы установит на 1.
Важно помнить что Date ссылочный тип данных и два объекта, содержащие одинаковые даты не будут равны друг другу при любом типе сравнения.
const newYear1 = new Date(2023, 11, 31, 23, 59, 59, 999); //2023-12-31T18:59:59.999Z const newYear2 = new Date("2023-12-31T18:59:59.999"); //2023-12-31T13:59:59.999Z const newYear3 = new Date(1704031199999); //передаем количество мс //2023-12-31T13:59:59.999Z console.log(newYear1 === newYear2); //false const ms = newYear1 - newYear2; //при этом разница в ms = 0 //0 newYear1.setDate(32); //устанавливаем несуществующий день в месяце console.log(newYear1); //2024-01-01T18:59:59.999Z дата подстроится под заданные параметры
По аналогии с методами для изменения значений даты, существуют методы для получения части значений. Такие методы имеют название .get или .getUTC для получения получения значений по Гринвичу.
const date = new Date(); //дата и время на момент вызова date.getHours(); //значение часов в месте вызова date.getUTCHours() //значение часов по Гринвичу
Работа с форматированием дат
В JavaScript доступны методы для вывода дат в виде строки разных форматов:
- .toString()
- не принимает параметров и возвращает строку в виде: день недели (Mon), первые три буквы месяца (Aug), день (28), год (2023), время без мс (12:45:30), часовой пояс относительно UTC (GMT-0700) и название часового пояса в скобках (Pacific Daylight Time).
- аналогичен .toString() , но возвращает только дату без времени.
- аналогичен .toString() , но возвращает только время без даты.
- аналогичен .toString() , но возвращает дату по Гринвичу.
- принимает настройки локализации (язык и название страны) и опции (например формат отображения часов в виде 24 или am/pm) и возвращает строку в принятом в указанной стране и языке формате.
- аналогичен .toLocalString() , но возвращает только дату без времени.
- аналогичен .toLocalString() , но возвращает только время без даты.
const date = new Date(); //стандартное форматирование //2023-08-29T14:47:07.820Z console.log(date.toString()); //в строку //Tue Aug 29 2023 19:47:07 GMT+0500 (Yekaterinburg Standard Time) console.log(date.toDateString()); //только дата //Tue Aug 29 2023 console.log(date.toTimeString()); //только время //19:47:07 GMT+0500 (Yekaterinburg Standard Time) console.log(date.toUTCString()); //по Гринвичу //Tue, 29 Aug 2023 14:47:07 GMT console.log(date.toLocaleString("en-US")); //англичйский США //8/29/2023, 7:47:07 PM console.log(date.toLocaleString("en-US", < hour12: false >)); //то же но 24 часовой формат //8/29/2023, 19:47:07 console.log(date.toLocaleDateString("de-DE")); //только дата немецкий Германия //29.8.2023 console.log(date.toLocaleTimeString("ko-KR")); //только время корейский Корея //오후 7:47:07Date можно сериализовать в формат JSON с помощью метода .toJSON() . Конструктор конечно же прекрасно распарсит такую строку.
const toJSON = new Date().toJSON(); //2023-08-29T14:51:52.158Z const toDate = new Date(toJSON); //2023-08-29T14:51:52.158Z console.log(typeof toJSON); //string console.log(typeof toDate);//objectЗаключение
Понимание концепций работы с датами и навык их применения позволят вам создавать более динамичные и функциональные веб-приложения на JavaScript. Не забывайте продолжать изучать и практиковать использование дат в своих проектах, чтобы стать опытным и уверенным разработчиком. Надеюсь что данная статья была полезна для понимания столь важной темы, а если вы хотите изучить основы языка или детально погрузиться в устройство JavaScript я подготовил подробные курсы.
Дата и время
Встречайте новый встроенный объект: Date. Он содержит дату и время, а также предоставляет методы управления ими.
Например, его можно использовать для хранения времени создания/изменения, для измерения времени или просто для вывода текущей даты.
Создание
Для создания нового объекта Date нужно вызвать конструктор new Date() с одним из следующих аргументов:
Без аргументов – создать объект Date с текущими датой и временем:
let now = new Date(); alert( now ); // показывает текущие дату и времяnew Date(milliseconds)
Создать объект Date с временем, равным количеству миллисекунд (тысячная доля секунды), прошедших с 1 января 1970 года UTC+0.
// 0 соответствует 01.01.1970 UTC+0 let Jan01_1970 = new Date(0); alert( Jan01_1970 ); // теперь добавим 24 часа и получим 02.01.1970 UTC+0 let Jan02_1970 = new Date(24 * 3600 * 1000); alert( Jan02_1970 );Целое число, представляющее собой количество миллисекунд, прошедших с начала 1970 года, называется таймстамп (англ. timestamp).
Это – легковесное численное представление даты. Из таймстампа всегда можно получить дату с помощью new Date(timestamp) и преобразовать существующий объект Date в таймстамп, используя метод date.getTime() (см. ниже).
Датам до 1 января 1970 будут соответствовать отрицательные таймстампы, например:
// 31 декабря 1969 года let Dec31_1969 = new Date(-24 * 3600 * 1000); alert( Dec31_1969 );new Date(datestring)
Если аргумент всего один, и это строка, то из неё «прочитывается» дата. Алгоритм разбора – такой же, как в Date.parse , который мы рассмотрим позже.
let date = new Date("2017-01-26"); alert(date); // Время не указано, поэтому оно ставится в полночь по Гринвичу и // меняется в соответствии с часовым поясом места выполнения кода // Так что в результате можно получить // Thu Jan 26 2017 11:00:00 GMT+1100 (восточно-австралийское время) // или // Wed Jan 25 2017 16:00:00 GMT-0800 (тихоокеанское время)new Date(year, month, date, hours, minutes, seconds, ms)
Создать объект Date с заданными компонентами в местном часовом поясе. Обязательны только первые два аргумента.
- year должен состоять из четырёх цифр. Для совместимости также принимаются 2 цифры и рассматриваются как 19xx , к примеру, 98 здесь это тоже самое, что и 1998 , но настоятельно рекомендуется всегда использовать 4 цифры.
- month начинается с 0 (январь) по 11 (декабрь).
- Параметр date здесь представляет собой день месяца. Если параметр не задан, то принимается значение 1 .
- Если параметры hours/minutes/seconds/ms отсутствуют, их значением становится 0 .
new Date(2011, 0, 1, 0, 0, 0, 0); // // 1 Jan 2011, 00:00:00 new Date(2011, 0, 1); // то же самое, так как часы и проч. равны 0Максимальная точность – 1 мс (до 1/1000 секунды):
let date = new Date(2011, 0, 1, 2, 3, 4, 567); alert( date ); // 1.01.2011, 02:03:04.567Получение компонентов даты
Существуют методы получения года, месяца и т.д. из объекта Date :
getFullYear() Получить год (4 цифры) getMonth() Получить месяц, от 0 до 11. getDate() Получить день месяца, от 1 до 31, что несколько противоречит названию метода. getHours(), getMinutes(), getSeconds(), getMilliseconds() Получить, соответственно, часы, минуты, секунды или миллисекунды.
Никакого getYear() . Только getFullYear()
Многие интерпретаторы JavaScript реализуют нестандартный и устаревший метод getYear() , который порой возвращает год в виде двух цифр. Пожалуйста, обходите его стороной. Если нужно значение года, используйте getFullYear() .
Кроме того, можно получить определённый день недели:
getDay() Вернуть день недели от 0 (воскресенье) до 6 (суббота). Несмотря на то, что в ряде стран за первый день недели принят понедельник, в JavaScript начало недели приходится на воскресенье.
Все вышеперечисленные методы возвращают значения в соответствии с местным часовым поясом.
Однако существуют и их UTC-варианты, возвращающие день, месяц, год для временной зоны UTC+0: getUTCFullYear(), getUTCMonth(), getUTCDay(). Для их использования требуется после «get» подставить «UTC» .
Если ваш местный часовой пояс смещён относительно UTC, то следующий код покажет разные часы:
// текущая дата let date = new Date(); // час в вашем текущем часовом поясе alert( date.getHours() ); // час в часовом поясе UTC+0 (лондонское время без перехода на летнее время) alert( date.getUTCHours() );Помимо вышеприведённых методов, существуют два особых метода без UTC-варианта:
Для заданной даты возвращает таймстамп – количество миллисекунд, прошедших с 1 января 1970 года UTC+0.
Возвращает разницу в минутах между UTC и местным часовым поясом:
// если вы в часовом поясе UTC-1, то выводится 60 // если вы в часовом поясе UTC+3, выводится -180 alert( new Date().getTimezoneOffset() );Установка компонентов даты
Следующие методы позволяют установить компоненты даты и времени:
- setFullYear(year, [month], [date])
- setMonth(month, [date])
- setDate(date)
- setHours(hour, [min], [sec], [ms])
- setMinutes(min, [sec], [ms])
- setSeconds(sec, [ms])
- setMilliseconds(ms)
- setTime(milliseconds) (устанавливает дату в виде целого количества миллисекунд, прошедших с 01.01.1970 UTC)
У всех этих методов, кроме setTime() , есть UTC-вариант, например: setUTCHours() .
Как мы видим, некоторые методы могут устанавливать сразу несколько компонентов даты, например: setHours . Если какая-то компонента не указана, она не меняется.
let today = new Date(); today.setHours(0); alert(today); // выводится сегодняшняя дата, но значение часа будет 0 today.setHours(0, 0, 0, 0); alert(today); // всё ещё выводится сегодняшняя дата, но время будет ровно 00:00:00.Автоисправление даты
Автоисправление – это очень полезная особенность объектов Date . Можно устанавливать компоненты даты вне обычного диапазона значений, а объект сам себя исправит.
let date = new Date(2013, 0, 32); // 32 Jan 2013 . alert(date); // . 1st Feb 2013!Неправильные компоненты даты автоматически распределяются по остальным.
Предположим, нам требуется увеличить дату «28 февраля 2016» на два дня. В зависимости от того, високосный это год или нет, результатом будет «2 марта» или «1 марта». Нам об этом думать не нужно. Просто прибавляем два дня. Объект Date позаботится об остальном:
let date = new Date(2016, 1, 28); date.setDate(date.getDate() + 2); alert( date ); // 1 Mar 2016Эту возможность часто используют, чтобы получить дату по прошествии заданного отрезка времени. Например, получим дату «спустя 70 секунд с текущего момента»:
let date = new Date(); date.setSeconds(date.getSeconds() + 70); alert( date ); // выводит правильную датуТакже можно установить нулевые или даже отрицательные значения. Например:
let date = new Date(2016, 0, 2); // 2 Jan 2016 date.setDate(1); // задать первое число месяца alert( date ); date.setDate(0); // первый день месяца -- это 1, так что выводится последнее число предыдущего месяца alert( date ); // 31 Dec 2015Преобразование к числу, разность дат
Если объект Date преобразовать в число, то получим таймстамп по аналогии с date.getTime() :
let date = new Date(); alert(+date); // количество миллисекунд, то же самое, что date.getTime()Важный побочный эффект: даты можно вычитать, в результате получаем разность в миллисекундах.
Этот приём можно использовать для измерения времени:
let start = new Date(); // начинаем отсчёт времени // выполняем некоторые действия for (let i = 0; i < 100000; i++) < let doSomething = i * i * i; >let end = new Date(); // заканчиваем отсчёт времени alert( `Цикл отработал за $ миллисекунд` );Date.now()
Если нужно просто измерить время, объект Date нам не нужен.
Существует особый метод Date.now() , возвращающий текущую метку времени.
Семантически он эквивалентен new Date().getTime() , однако метод не создаёт промежуточный объект Date . Так что этот способ работает быстрее и не нагружает сборщик мусора.
Данный метод используется из соображений удобства или когда важно быстродействие, например, при разработке игр на JavaScript или других специализированных приложений.
Вероятно, предыдущий пример лучше переписать так:
let start = Date.now(); // количество миллисекунд с 1 января 1970 года // выполняем некоторые действия for (let i = 0; i < 100000; i++) < let doSomething = i * i * i; >let end = Date.now(); // заканчиваем отсчёт времени alert( `Цикл отработал за $ миллисекунд` ); // вычитаются числа, а не датыБенчмаркинг
Будьте внимательны, если хотите точно протестировать производительность функции, которая зависит от процессора.
Например, сравним две функции, вычисляющие разницу между двумя датами: какая сработает быстрее?
Подобные вычисления, замеряющие производительность, также называют «бенчмарками» (benchmark).
// есть date1 и date2, какая функция быстрее вернёт разницу между ними в миллисекундах? function diffSubtract(date1, date2) < return date2 - date1; >// или function diffGetTime(date1, date2)
Обе функции делают буквально одно и то же, только одна использует явный метод date.getTime() для получения даты в миллисекундах, а другая полагается на преобразование даты в число. Результат их работы всегда один и тот же.
Но какая функция быстрее?
Для начала можно запустить их много раз подряд и засечь разницу. В нашем случае функции очень простые, так что потребуется хотя бы 100000 повторений.
function diffSubtract(date1, date2) < return date2 - date1; >function diffGetTime(date1, date2) < return date2.getTime() - date1.getTime(); >function bench(f) < let date1 = new Date(0); let date2 = new Date(); let start = Date.now(); for (let i = 0; i < 100000; i++) f(date1, date2); return Date.now() - start; >alert( 'Время diffSubtract: ' + bench(diffSubtract) + 'мс' ); alert( 'Время diffGetTime: ' + bench(diffGetTime) + 'мс' );Вот это да! Метод getTime() работает ощутимо быстрее! Всё потому, что не производится преобразование типов, и интерпретаторам такое намного легче оптимизировать.
Замечательно, это уже что-то. Но до хорошего бенчмарка нам ещё далеко.
Представьте, что при выполнении bench(diffSubtract) процессор параллельно делал что-то ещё, также потребляющее ресурсы. А к началу выполнения bench(diffGetTime) он это уже завершил.
Достаточно реалистичный сценарий в современных многопроцессорных операционных системах.
В итоге у первого бенчмарка окажется меньше ресурсов процессора, чем у второго. Это может исказить результаты.
Для получения наиболее достоверных результатов тестирования производительности весь набор бенчмарков нужно запускать по нескольку раз.
function diffSubtract(date1, date2) < return date2 - date1; >function diffGetTime(date1, date2) < return date2.getTime() - date1.getTime(); >function bench(f) < let date1 = new Date(0); let date2 = new Date(); let start = Date.now(); for (let i = 0; i < 100000; i++) f(date1, date2); return Date.now() - start; >let time1 = 0; let time2 = 0; // bench(diffSubtract) и bench(diffGetTime) поочерёдно запускаются 10 раз for (let i = 0; i < 10; i++) < time1 += bench(diffSubtract); time2 += bench(diffGetTime); >alert( 'Итоговое время diffSubtract: ' + time1 ); alert( 'Итоговое время diffGetTime: ' + time2 );Современные интерпретаторы JavaScript начинают применять продвинутые оптимизации только к «горячему коду», выполняющемуся несколько раз (незачем оптимизировать то, что редко выполняется). Так что в примере выше первые запуски не оптимизированы должным образом. Нелишним будет добавить предварительный запуск для «разогрева»:
// добавляем для "разогрева" перед основным циклом bench(diffSubtract); bench(diffGetTime); // а теперь тестируем производительность for (let i = 0; i
Будьте осторожны с микробенчмарками
Современные интерпретаторы JavaScript выполняют множество оптимизаций. Они могут повлиять на результаты «искусственных тестов» по сравнению с «нормальным использованием», особенно если мы тестируем что-то очень маленькое, например, работу оператора или встроенной функции. Поэтому если хотите серьёзно понять производительность, пожалуйста, изучите, как работают интерпретаторы JavaScript. И тогда вам, вероятно, уже не понадобятся микробенчмарки.
Отличный набор статей о V8 можно найти на https://mrale.ph.
Разбор строки с датой
Метод Date.parse(str) считывает дату из строки.
Формат строки должен быть следующим: YYYY-MM-DDTHH:mm:ss.sssZ , где:
- YYYY-MM-DD – это дата: год-месяц-день.
- Символ «T» используется в качестве разделителя.
- HH:mm:ss.sss – время: часы, минуты, секунды и миллисекунды.
- Необязательная часть ‘Z’ обозначает часовой пояс в формате +-hh:mm . Если указать просто букву Z , то получим UTC+0.
Возможны и более короткие варианты, например, YYYY-MM-DD или YYYY-MM , или даже YYYY .
Вызов Date.parse(str) обрабатывает строку в заданном формате и возвращает таймстамп (количество миллисекунд с 1 января 1970 года UTC+0). Если формат неправильный, возвращается NaN .
let ms = Date.parse('2012-01-26T13:51:50.417-07:00'); alert(ms); // 1327611110417 (таймстамп)Можно тут же создать объект new Date из таймстампа:
Дата и Время
Материал на этой странице устарел, поэтому скрыт из оглавления сайта.
Более новая информация по этой теме находится на странице https://learn.javascript.ru/date.
Для работы с датой и временем в JavaScript используются объекты Date.
Создание
Для создания нового объекта типа Date используется один из синтаксисов:
Создаёт объект Date с текущей датой и временем:
var now = new Date(); alert( now );new Date(milliseconds)
Создаёт объект Date , значение которого равно количеству миллисекунд (1/1000 секунды), прошедших с 1 января 1970 года GMT+0.
// 24 часа после 01.01.1970 GMT+0 var Jan02_1970 = new Date(3600 * 24 * 1000); alert( Jan02_1970 );new Date(datestring)
Если единственный аргумент – строка, используется вызов Date.parse (см. далее) для чтения даты из неё.
new Date(year, month, date, hours, minutes, seconds, ms)
Дату можно создать, используя компоненты в местной временной зоне. Для этого формата обязательны только первые два аргумента. Отсутствующие параметры, начиная с hours считаются равными нулю, а date – единице.
- Год year должен быть из 4 цифр.
- Отсчёт месяцев month начинается с нуля 0. Например:
new Date(2011, 0, 1, 0, 0, 0, 0); // // 1 января 2011, 00:00:00 new Date(2011, 0, 1); // то же самое, часы/секунды по умолчанию равны 0Дата задана с точностью до миллисекунд:
var date = new Date(2011, 0, 1, 2, 3, 4, 567); alert( date ); // 1.01.2011, 02:03:04.567Получение компонентов даты
Для доступа к компонентам даты-времени объекта Date используются следующие методы:
getFullYear() Получить год (из 4 цифр) getMonth() Получить месяц, от 0 до 11. getDate() Получить число месяца, от 1 до 31. getHours(), getMinutes(), getSeconds(), getMilliseconds() Получить соответствующие компоненты.
Не getYear() , а getFullYear()
Некоторые браузеры реализуют нестандартный метод getYear() . Где-то он возвращает только две цифры из года, где-то четыре. Так или иначе, этот метод отсутствует в стандарте JavaScript. Не используйте его. Для получения года есть getFullYear() .
Дополнительно можно получить день недели:
getDay() Получить номер дня в неделе. Неделя в JavaScript начинается с воскресенья, так что результат будет числом от 0(воскресенье) до 6(суббота).
Все методы, указанные выше, возвращают результат для местной временной зоны.
Существуют также UTC-варианты этих методов, возвращающие день, месяц, год и т.п. для зоны GMT+0 (UTC): getUTCFullYear() , getUTCMonth() , getUTCDay() . То есть, сразу после «get» вставляется «UTC» .
Если ваше локальное время сдвинуто относительно UTC, то следующий код покажет разные часы:
// текущая дата var date = new Date(); // час в текущей временной зоне alert( date.getHours() ); // сколько сейчас времени в Лондоне? // час в зоне GMT+0 alert( date.getUTCHours() );Кроме описанных выше, существуют два специальных метода без UTC-варианта:
Возвращает число миллисекунд, прошедших с 1 января 1970 года GMT+0, то есть того же вида, который используется в конструкторе new Date(milliseconds) .
Возвращает разницу между местным и UTC-временем, в минутах.
alert( new Date().getTimezoneOffset() ); // Для GMT-1 выведет 60Установка компонентов даты
Следующие методы позволяют устанавливать компоненты даты и времени:
- setFullYear(year [, month, date])
- setMonth(month [, date])
- setDate(date)
- setHours(hour [, min, sec, ms])
- setMinutes(min [, sec, ms])
- setSeconds(sec [, ms])
- setMilliseconds(ms)
- setTime(milliseconds) (устанавливает всю дату по миллисекундам с 01.01.1970 UTC)
Все они, кроме setTime() , обладают также UTC-вариантом, например: setUTCHours() .
Как видно, некоторые методы могут устанавливать несколько компонентов даты одновременно, в частности, setHours . При этом если какая-то компонента не указана, она не меняется. Например:
var today = new Date; today.setHours(0); alert( today ); // сегодня, но час изменён на 0 today.setHours(0, 0, 0, 0); alert( today ); // сегодня, ровно 00:00:00.Автоисправление даты
Автоисправление – очень удобное свойство объектов Date . Оно заключается в том, что можно устанавливать заведомо некорректные компоненты (например 32 января), а объект сам себя поправит.
var d = new Date(2013, 0, 32); // 32 января 2013 . alert(d); // . это 1 февраля 2013!Неправильные компоненты даты автоматически распределяются по остальным.
Например, нужно увеличить на 2 дня дату «28 февраля 2011». Может быть так, что это будет 2 марта, а может быть и 1 марта, если год високосный. Но нам обо всем этом думать не нужно. Просто прибавляем два дня. Остальное сделает Date :
var d = new Date(2011, 1, 28); d.setDate(d.getDate() + 2); alert( d ); // 2 марта, 2011Также это используют для получения даты, отдалённой от имеющейся на нужный промежуток времени. Например, получим дату на 70 секунд большую текущей:
var d = new Date(); d.setSeconds(d.getSeconds() + 70); alert( d ); // выведет корректную датуМожно установить и нулевые, и даже отрицательные компоненты. Например:
var d = new Date; d.setDate(1); // поставить первое число месяца alert( d ); d.setDate(0); // нулевого числа нет, будет последнее число предыдущего месяца alert( d );var d = new Date; d.setDate(-1); // предпоследнее число предыдущего месяца alert( d );Преобразование к числу, разность дат
Когда объект Date используется в числовом контексте, он преобразуется в количество миллисекунд:
alert(+new Date) // +date то же самое, что: +date.valueOf()Важный побочный эффект: даты можно вычитать, результат вычитания объектов Date – их временная разница, в миллисекундах.
Это используют для измерения времени:
var start = new Date; // засекли время // что-то сделать for (var i = 0; i < 100000; i++) < var doSomething = i * i * i; >var end = new Date; // конец измерения alert( "Цикл занял " + (end - start) + " ms" );Бенчмаркинг
Допустим, у нас есть несколько вариантов решения задачи, каждый описан функцией.
Как узнать, какой быстрее?
Для примера возьмём две функции, которые бегают по массиву:
function walkIn(arr) < for (var key in arr) arr[key]++ >function walkLength(arr)
Чтобы померить, какая из них быстрее, нельзя запустить один раз walkIn , один раз walkLength и замерить разницу. Одноразовый запуск ненадёжен, любая мини-помеха исказит результат.
Для правильного бенчмаркинга функция запускается много раз, чтобы сам тест занял существенное время. Это сведёт влияние помех к минимуму. Сложную функцию можно запускать 100 раз, простую – 1000 раз…
Померяем, какая из функций быстрее:
var arr = []; for (var i = 0; i < 1000; i++) arr[i] = 0; function walkIn(arr) < for (var key in arr) arr[key]++; >function walkLength(arr) < for (var i = 0; i < arr.length; i++) arr[i]++; >function bench(f) < var date = new Date(); for (var i = 0; i < 10000; i++) f(arr); return new Date() - date; >alert( 'Время walkIn: ' + bench(walkIn) + 'мс' ); alert( 'Время walkLength: ' + bench(walkLength) + 'мс' );Теперь представим себе, что во время первого бенчмаркинга bench(walkIn) компьютер что-то делал параллельно важное (вдруг) и это занимало ресурсы, а во время второго – перестал. Реальная ситуация? Конечно реальна, особенно на современных ОС, где много процессов одновременно.
Гораздо более надёжные результаты можно получить, если весь пакет тестов прогнать много раз.
var arr = []; for (var i = 0; i < 1000; i++) arr[i] = 0; function walkIn(arr) < for (var key in arr) arr[key]++; >function walkLength(arr) < for (var i = 0; i < arr.length; i++) arr[i]++; >function bench(f) < var date = new Date(); for (var i = 0; i < 1000; i++) f(arr); return new Date() - date; >// bench для каждого теста запустим много раз, чередуя var timeIn = 0, timeLength = 0; for (var i = 0; i < 100; i++) < timeIn += bench(walkIn); timeLength += bench(walkLength); >alert( 'Время walkIn: ' + timeIn + 'мс' ); alert( 'Время walkLength: ' + timeLength + 'мс' );Более точное время с performance.now()
В современных браузерах (кроме IE9-) вызов performance.now() возвращает количество миллисекунд, прошедшее с начала загрузки страницы. Причём именно с самого начала, до того, как загрузился HTML-файл, если точнее – с момента выгрузки предыдущей страницы из памяти.
Так что это время включает в себя всё, включая начальное обращение к серверу.
Его можно посмотреть в любом месте страницы, даже в , чтобы узнать, сколько времени потребовалось браузеру, чтобы до него добраться, включая загрузку HTML.
Возвращаемое значение измеряется в миллисекундах, но дополнительно имеет точность 3 знака после запятой (до миллионных долей секунды!), поэтому можно использовать его и для более точного бенчмаркинга в том числе.
console.time(метка) и console.timeEnd(метка)
Для измерения с одновременным выводом результатов в консоли есть методы:
- console.time(метка) – включить внутренний хронометр браузера с меткой.
- console.timeEnd(метка) – выключить внутренний хронометр браузера с меткой и вывести результат.
Параметр «метка» используется для идентификации таймера, чтобы можно было делать много замеров одновременно и даже вкладывать измерения друг в друга.
В коде ниже таймеры walkIn , walkLength – конкретные тесты, а таймер «All Benchmarks» – время «на всё про всё»:
var arr = []; for (var i = 0; i < 1000; i++) arr[i] = 0; function walkIn(arr) < for (var key in arr) arr[key]++; >function walkLength(arr) < for (var i = 0; i < arr.length; i++) arr[i]++; >function bench(f) < for (var i = 0; i < 10000; i++) f(arr); >console.time("All Benchmarks"); console.time("walkIn"); bench(walkIn); console.timeEnd("walkIn"); console.time("walkLength"); bench(walkLength); console.timeEnd("walkLength"); console.timeEnd("All Benchmarks");При запуске этого примера нужно открыть консоль, иначе вы ничего не увидите.
Внимание, оптимизатор!
Современные интерпретаторы JavaScript делают массу оптимизаций, например:
- Автоматически выносят инвариант, то есть постоянное в цикле значение типа arr.length , за пределы цикла.
- Стараются понять, значения какого типа хранит данная переменная или массив, какую структуру имеет объект и, исходя из этого, оптимизировать внутренние алгоритмы.
- Выполняют простейшие операции, например сложение явно заданных чисел и строк, на этапе компиляции.
- Могут обнаружить, что некий код, например присваивание к неиспользуемой локальной переменной, ни на что не влияет и вообще исключить его из выполнения, хотя делают это редко.
Эти оптимизации могут влиять на результаты тестов, поэтому измерять скорость базовых операций JavaScript («проводить микробенчмаркинг») до того, как вы изучите внутренности JavaScript-интерпретаторов и поймёте, что они реально делают на таком коде, не рекомендуется.
Форматирование и вывод дат
Во всех браузерах, кроме IE10-, поддерживается новый стандарт Ecma 402, который добавляет специальные методы для форматирования дат.
Это делается вызовом date.toLocaleString(локаль, опции) , в котором можно задать много настроек. Он позволяет указать, какие параметры даты нужно вывести, и ряд настроек вывода, после чего интерпретатор сам сформирует строку.
Пример с почти всеми параметрами даты и русским, затем английским (США) форматированием:
var date = new Date(2014, 11, 31, 12, 30, 0); var options = < era: 'long', year: 'numeric', month: 'long', day: 'numeric', weekday: 'long', timezone: 'UTC', hour: 'numeric', minute: 'numeric', second: 'numeric' >; alert( date.toLocaleString("ru", options) ); // среда, 31 декабря 2014 г. н.э. 12:30:00 alert( date.toLocaleString("en-US", options) ); // Wednesday, December 31, 2014 Anno Domini 12:30:00 PMВы сможете подробно узнать о них в статье Intl: интернационализация в JavaScript, которая посвящена этому стандарту.
Методы вывода без локализации:
toString() , toDateString() , toTimeString() Возвращают стандартное строчное представление, не заданное жёстко в стандарте, а зависящее от браузера. Единственное требование к нему – читаемость человеком. Метод toString возвращает дату целиком, toDateString() и toTimeString() – только дату и время соответственно.
var d = new Date(); alert( d.toString() ); // вывод, похожий на 'Wed Jan 26 2011 16:40:50 GMT+0300'toUTCString() То же самое, что toString() , но дата в зоне UTC.
toISOString() Возвращает дату в формате ISO Детали формата будут далее. Поддерживается современными браузерами, не поддерживается IE8-.
var d = new Date(); alert( d.toISOString() ); // вывод, похожий на '2011-01-26T13:51:50.417Z'Если хочется иметь большую гибкость и кросс-браузерность, то также можно воспользоваться специальной библиотекой, например Moment.JS или написать свою функцию форматирования.
Разбор строки, Date.parse
Все современные браузеры, включая IE9+, понимают даты в упрощённом формате ISO 8601 Extended.
Этот формат выглядит так: YYYY-MM-DDTHH:mm:ss.sssZ , где:
- YYYY-MM-DD – дата в формате год-месяц-день.
- Обычный символ T используется как разделитель.
- HH:mm:ss.sss – время: часы-минуты-секунды-миллисекунды.
- Часть ‘Z’ обозначает временную зону – в формате +-hh:mm , либо символ Z , обозначающий UTC. По стандарту её можно не указывать, тогда UTC, но в Safari с этим ошибка, так что лучше указывать всегда.
Также возможны укороченные варианты, например YYYY-MM-DD или YYYY-MM или даже только YYYY .
Метод Date.parse(str) разбирает строку str в таком формате и возвращает соответствующее ей количество миллисекунд. Если это невозможно, Date.parse возвращает NaN .
var msUTC = Date.parse('2012-01-26T13:51:50.417Z'); // зона UTC alert( msUTC ); // 1327571510417 (число миллисекунд)С таймзоной -07:00 GMT :
var ms = Date.parse('2012-01-26T13:51:50.417-07:00'); alert( ms ); // 1327611110417 (число миллисекунд)Формат дат для IE8-
До появления спецификации ECMAScript 5 формат не был стандартизован, и браузеры, включая IE8-, имели свои собственные форматы дат. Частично, эти форматы пересекаются.
Например, код ниже работает везде, включая старые IE:
var ms = Date.parse("January 26, 2011 13:51:50"); alert( ms );Вы также можете почитать о старых форматах IE в документации к методу MSDN Date.parse.
Конечно же, сейчас лучше использовать современный формат. Если же нужна поддержка IE8-, то метод Date.parse , как и ряд других современных методов, добавляется библиотекой es5-shim.
Метод Date.now()
Метод Date.now() возвращает дату сразу в виде миллисекунд.
Технически, он аналогичен вызову +new Date() , но в отличие от него не создаёт промежуточный объект даты, а поэтому – во много раз быстрее.
Его использование особенно рекомендуется там, где производительность при работе с датами критична. Обычно это не на веб-страницах, а, к примеру, в разработке игр на JavaScript.
Итого
- Дата и время представлены в JavaScript одним объектом: Date. Создать «только время» при этом нельзя, оно должно быть с датой. Список методов Date вы можете найти в справочнике Date или выше.
- Отсчёт месяцев начинается с нуля.
- Отсчёт дней недели (для getDay() ) тоже начинается с нуля (и это воскресенье).
- Объект Date удобен тем, что автокорректируется. Благодаря этому легко сдвигать даты.
- При преобразовании к числу объект Date даёт количество миллисекунд, прошедших с 1 января 1970 UTC. Побочное следствие – даты можно вычитать, результатом будет разница в миллисекундах.
- Для получения текущей даты в миллисекундах лучше использовать Date.now() , чтобы не создавать лишний объект Date (кроме IE8-)
- Для бенчмаркинга лучше использовать performance.now() (кроме IE9-), он в 1000 раз точнее.
Задачи
Вывести дату в формате дд.мм.гг
важность: 3
Напишите функцию formatDate(date) , которая выводит дату date в формате дд.мм.гг :
var d = new Date(2014, 0, 30); // 30 января 2014 alert( formatDate(d) ); // '30.01.14'P.S. Обратите внимание, ведущие нули должны присутствовать, то есть 1 января 2001 должно быть 01.01.01, а не 1.1.1.
Получим компоненты один за другим.
-
День можно получить как date.getDate() . При необходимости добавим ведущий ноль:
var dd = date.getDate(); if (dd < 10) dd = '0' + dd;var mm = date.getMonth() + 1; // месяц 1-12 if (mm < 10) mm = '0' + mm;var yy = date.getFullYear() % 100; if (yy < 10) yy = '0' + yy;