Полное руководство по датам в JavaScript 

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

JavaScript предоставляет нам функциональность обработки даты при помощи мощного встроенного объекта: Date.

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

Объект Date

Экземпляр объекта Date представляет текущий момент времени. Несмотря на имя Date, он также обрабатывает время.

Инициализируйте объект Date

Мы инициализируем объект Date с помощью конструкции:

new Date()

Это создает объект Date, указывающий на текущий момент времени.

Внутренне даты выражаются в миллисекундах с 1 января 1970 года (UTC).

Возможно, вы знакомы с отметкой времени UNIX: она представляет количество секунд , прошедших с этой известной даты.

Временные метки UNIX указываются в секундах а JavaScript объект Date работает с миллисекундами, это важно помнить работая с timestamp

Если у нас есть отметка времени UNIX, мы можем создать экземпляр объекта Date с помощью:

const timestamp = 1530826365
new Date(timestamp * 1000)

Если мы передадим 0, мы получим объект Date, который представляет время на 1 января 1970 года (UTC):

new Date(0)

Если мы передаем строку, а не число, тогда объект Date использует метод parse, чтобы определить, какую дату вы передаете. Примеры:

new Date('2018-07-22')
new Date('2018-07') //July 1st 2018, 00:00:00
new Date('2018') //Jan 1st 2018, 00:00:00
new Date('07/22/2018')
new Date('2018/07/22')
new Date('2018/7/22')
new Date('July 22, 2018')
new Date('July 22, 2018 07:22:13')
new Date('2018-07-22 07:22:13')
new Date('2018-07-22T07:22:13')
new Date('25 March 2018')
new Date('25 Mar 2018')
new Date('25 March, 2018')
new Date('March 25, 2018')
new Date('March 25 2018')
new Date('March 2018') //Mar 1st 2018, 00:00:00
new Date('2018 March') //Mar 1st 2018, 00:00:00
new Date('2018 MARCH') //Mar 1st 2018, 00:00:00
new Date('2018 march') //Mar 1st 2018, 00:00:00

Здесь много гибкости. Вы можете добавить или опустить ведущий ноль в месяцах или днях.

Будьте осторожны с позицией месяц / деня, иначе вы можете ошибочно истолковать месяц как день.

Вы также можете использовать Date.parse:

Date.parse('2018-07-22')
Date.parse('2018-07') //July 1st 2018, 00:00:00
Date.parse('2018') //Jan 1st 2018, 00:00:00
Date.parse('07/22/2018')
Date.parse('2018/07/22')
Date.parse('2018/7/22')
Date.parse('July 22, 2018')
Date.parse('July 22, 2018 07:22:13')
Date.parse('2018-07-22 07:22:13')
Date.parse('2018-07-22T07:22:13')

Date.parse вернет метку времени (в миллисекундах), а не объект Date.

Вы также можете передать набор упорядоченных значений, которые представляют каждую часть даты: год, месяц (начиная с 0), день, час, минуты, секунды и миллисекунды:

new Date(2018, 6, 22, 7, 22, 13, 0)
new Date(2018, 6, 22)

Минимум должен быть 3 параметра, но большинство движков JavaScript также интерпретируют меньшее их число:

new Date(2018, 6) //Sun Jul 01 2018 00:00:00 GMT+0200 (Central European Summer Time)
new Date(2018) //Thu Jan 01 1970 01:00:02 GMT+0100 (Central European Standard Time)

В любом из этих случаев полученная дата относится к часовому поясу вашего компьютера. Это означает, что два разных компьютера могут выводить разные значения для одного и того же объекта даты.

JavaScript, без какой-либо информации о часовом поясе, будет считать дату UTC и автоматически выполнит преобразование в текущий часовой пояс компьютера.

Итак, суммируя, вы можете создать новый объект Date четырьмя способами

• не передавая никаких параметров, создает объект Date, который представляет текущую дату и время
• передача числа, которое представляет миллисекунды с 1 января 1970 года
• передавая строку, которая представляет дату
• передавая набор параметров, которые представляют различные части даты

Часовые пояса

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

Вы можете указать часовой пояс, добавив его в формате +HOURS или добавив имя часового пояса в скобках:

new Date('July 22, 2018 07:22:13 +0700')
new Date('July 22, 2018 07:22:13 (CET)')

Если вы укажете неправильное имя часового пояса в скобках, JavaScript по умолчанию будет считать дату UTC без вывода ошибки.

Если вы укажете неправильный числовой формат, JavaScript будет выдавать сообщение об ошибке «Invalid Date».

Преобразование даты и форматирование

Для данного объекта Date существует множество методов, которые сгенерируют строку с этой датой:

const date = new Date('July 22, 2018 07:22:13')

date.toString() // "Sun Jul 22 2018 07:22:13 GMT+0200 (Central European Summer Time)"
date.toTimeString() //"07:22:13 GMT+0200 (Central European Summer Time)"
date.toUTCString() //"Sun, 22 Jul 2018 05:22:13 GMT"
date.toDateString() //"Sun Jul 22 2018"
date.toISOString() //"2018-07-22T05:22:13.000Z" (ISO 8601 format)
date.toLocaleString() //"22/07/2018, 07:22:13"
date.toLocaleTimeString() //"07:22:13"
date.getTime() //1532236933000
date.getTime() //1532236933000

Методы получения объекта Date

Объект Date предлагает несколько методов для проверки его значения. Все это зависит от текущего часового пояса компьютера:

const date = new Date('July 22, 2018 07:22:13')

date.getDate() //22
date.getDay() //0 (0 means sunday, 1 means monday..)
date.getFullYear() //2018
date.getMonth() //6 (starts from 0)
date.getHours() //7
date.getMinutes() //22
date.getSeconds() //13
date.getMilliseconds() //0 (not specified)
date.getTime() //1532236933000
date.getTimezoneOffset() //-120 (will vary depending on where you are and when you check - this is CET during the summer). Returns the timezone difference expressed in minutes

Существуют эквивалентные версии этих методов в формате UTC, которые возвращают значение UTC, а не значения, адаптированные к вашему текущему часовому поясу:

date.getUTCDate() //22
date.getUTCDay() //0 (0 means sunday, 1 means monday..)
date.getUTCFullYear() //2018
date.getUTCMonth() //6 (starts from 0)
date.getUTCHours() //5 (not 7 like above)
date.getUTCMinutes() //22
date.getUTCSeconds() //13
date.getUTCMilliseconds() //0 (not specified)

Редактирование даты

Объект Date предлагает несколько методов для редактирования значения даты:

const date = new Date('July 22, 2018 07:22:13')

date.setDate(newValue)
date.setDay(newValue)
date.setFullYear(newValue) //note: avoid setYear(), it's deprecated
date.setMonth(newValue)
date.setHours(newValue)
date.setMinutes(newValue)
date.setSeconds(newValue)
date.setMilliseconds(newValue)
date.setTime(newValue)
date.setTimezoneOffset(newValue)

setDay и setMonth принимают нумерацию с 0, например, март месяц имеет индекс 2.

Забавный факт: эти методы «пересекаются», поэтому, если вы, например, установите date.setHours(48), он также будет увеличивать день.

Полезно знать: вы можете добавить более одного параметра, чтобы setHours() также установил минуты, секунды и миллисекунды: setHours(0, 0, 0, 0) - то же самое относится к методам setMinutes и setSeconds.

Методы set также имеют эквивалент UTC:

const date = new Date('July 22, 2018 07:22:13')

date.setUTCDate(newValue)
date.setUTCDay(newValue)
date.setUTCFullYear(newValue)
date.setUTCMonth(newValue)
date.setUTCHours(newValue)
date.setUTCMinutes(newValue)
date.setUTCSeconds(newValue)
date.setUTCMilliseconds(newValue)

Получить текущую метку времени

Если вы хотите получить текущую метку времени в миллисекундах, вы можете использовать сокращение

Date.now()

вместо

new Date().getTime()

JavaScript старается работать без ошибок

Обращать внимание. Если вы передадите большее количеством дней в месяце, ошибок не будет, и дата перейдет к следующему месяцу:

new Date(2018, 6, 40) //Thu Aug 09 2018 00:00:00 GMT+0200 (Central European Summer Time)

То же самое касается месяцев, часов, минут, секунд и миллисекунд.

Формат даты в соответствии с локалью

Internationalization API, хорошо поддерживается в современных браузерах (заметное исключение: UC Browser), позволяя переводить даты.

Он предоставляет объектом Intl, который также помогает локализовать числа, строки и валюты.

Мы будем использовать для преобразования даты метод Intl.DateTimeFormat().

Отформатируйте дату в соответствии с локалью компьютера по умолчанию:

// "12/22/2017"
const date = new Date('July 22, 2018 07:22:13')
new Intl.DateTimeFormat().format(date) //"22/07/2018" in my locale

Отформатируйте дату в соответствии с другим языком:

new Intl.DateTimeFormat('en-US').format(date) //"7/22/2018"

Метод Intl.DateTimeFormat принимает необязательный параметр, который позволяет настроить вывод. Чтобы также отображать часы, минуты и секунды:

const options = {
 year: 'numeric',
 month: 'numeric',
 day: 'numeric',
 hour: 'numeric',
 minute: 'numeric',
 second: 'numeric'
}

new Intl.DateTimeFormat('en-US', options).format(date) 
//"7/22/2018, 7:22:13 AM"

new Intl.DateTimeFormat('it-IT', options2).format(date) 
//"22/7/2018, 07:22:13"

Сравнение двух дат

Вы можете рассчитать разницу между двумя датами, используя Date.getTime():

const date1 = new Date('July 10, 2018 07:22:13')
const date2 = new Date('July 22, 2018 07:22:13')
const diff = date2.getTime() - date1.getTime() //difference in milliseconds

Таким же образом вы можете проверить, равны ли две даты:

const date1 = new Date('July 10, 2018 07:22:13')
const date2 = new Date('July 10, 2018 07:22:13')
if (date2.getTime() === date1.getTime()) {
 //dates are equal
}

Имейте в виду, что метод getTime() возвращает количество миллисекунд, поэтому при сравнении необходимо учитывать время. July 10, 2018 07:22:13 не равно July 10, 2018. В этом случае вы можете использовать метод setHours(0, 0, 0, 0) для сброса времени.