Парсинг, валидация, манипулирование и отображение дат времени в javascript с помощью day.js

Объект Date

Date – это встроенный объект JavaScript, который хранит дату и время. Он предоставляет ряд встроенных методов для форматирования и управления этими данными.

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

Для примера попробуйте присвоить переменной текущую дату. Создайте файл now.js.

В выводе получается строка с датой, которая содержит следующие данные:

День недели	Месяц	День	Год	Час	Минуты	Секунды	Часовой пояс
Wed	Oct	18	2017	12	41	34	GMT+0000 (UTC)

Дата и время разбиваются и отображаются удобным для восприятия образом.

Однако JavaScript воспринимает дату, исходя из временной метки Unix-времени, которая представляет собой значение, состоящее из количества миллисекунд, прошедших с полуночи 1 января 1970 года. Получить метку времени можно с помощью метода getTime().

Большое число, которое появляется в выводе в качестве текущей временной метки, представляет собой количество миллисекунд, прошедших с полуночи 1 января 1970 года на 18 октября 2017 года.

Нулевое время (или epoch time) представлено строкой даты 01 January, 1970 00:00:00 Universal Time (UTC) и временной меткой 0. Вы можете проверить это в браузере, создав в файле epoch.js новую переменную и присвоив ей новый экземпляр Date, основанный на отметке времени 0.

Нулевое время было выбрано в качестве стандарта для измерения времени компьютерами, и этот метод используется в JavaScript

Важно понимать временные метки и строки дат, поскольку эти понятия могут использоваться в зависимости от настроек и цели приложения

Теперь вы знаете, как создать новый экземпляр Date на основе текущего времени и на основе временной метки. В общей сложности существует четыре формата Date в JavaScript. Кроме текущего времени по умолчанию и временной метки также можно использовать строку даты или указать конкретную дату и время.

Метод создания Date	Вывод
new Date()	Текущая дата и время
new Date(timestamp)	Дата на основе миллисекунд, прошедших с нулевого времени
new Date(date string)	Дата на основе строки даты
new Date(year, month, day, hours, minutes, seconds, milliseconds)	Дата на основе заданной даты и времени

Чтобы продемонстрировать различные способы ссылок на конкретную дату, попробуйте создать новые объекты Date, которые будут представлять 4 июля 1776 года, 12:30 по Гринвичу тремя различными способами.

Все эти примеры представляют одну и ту же информацию о дате и времени тремя разными способами.

Как видите, метод временной метки имеет отрицательное число; любая дата до нулевого времени будет представлена как отрицательное число.

В третьем примере секунды и миллисекунды представлены 0. Если при создании объекта Date вам не хватает каких-либо данных, вы должны присвоить им 0. Отсутствующие данные нельзя пропускать, поскольку порядок данных о времени в строке не меняется. Также следует отметить, что месяц июль здесь обозначен как 6, а не как 7. Это происходит потому, что отсчет начинается не с 1, а с 0. Подробнее об этом – в следующем разделе.

Базовые знания

В первую очередь нужно изучить и хорошо ориентироваться в таких темах:

- - основные понятия JavaScript (переменные, операторы, условия, функции, события);
  - объектно-ориентированный JS (конструкторы, фабрики, наследование);
  - функциональное программирование, функциональный JS (стиль написания программ, при котором просто комбинируется набор функций) — функции высшего порядка, каррирование, чистые функции, fantasy-land, аппликативные функторы, функторы замыкания, рекурсия и т.д.;
  - декларативное (что?) и императивное (как?) программирование;
  - спецификации тестов Jasmine;
  - основы HTML, CSS и jQuery.

Git

Git (не путать с сайтом для размещения git-репозиториев GitHub) — один из важнейших инструментов разработчика. На первых порах он может ещё быть неактуальным, но при расширении вашего кругозора и выполнении крупных проектов без него не обойтись.

Вот главные аспекты, в которых нужно ориентироваться:

- - настройка репозиториев в GitHub;
  - создание и перемещение файлов в каталогах;
  - инициализация и коммиты в Git.

Алгоритмы и структуры данных

Нужно изучить (или вспомнить) алгоритмы (сложность алгоритмов), базовые структуры данных (связные списки, очереди, стеки, двоичные деревья поиска, хэш-таблицы…).

В какой последовательности можно учить язык JavaScript?

1. Изучите основы языка. Список того, что нужно знать, . Все это можно выучить самостоятельно, пользуясь бесплатным учебником Learn.javascript.ru. Он написан на русском языке просто и понятно.

Если вам нужен наставник, то можно пойти на курсы. Например:

Курс по frontend-разработке в Нетологии – включает изучение JavaScript и других технологий, применяемых в разработке сайтов.
Курс по JavaScript в Geekbrains – включает не только обучение, но и стражировку в компаниях-партнерах, например, Майл.ру.
Fullstack-разработчик на JavaScript в Skillbox – посвящен исключительно одному языку программирования и позволяет изучить его на хорошем уровне с нуля.

2. Изучите библиотеки, например, jQuery и React. Это наборы готовых решений, которые можно использовать для ускорения работы. Нет смысла писать все скрипты с нуля, когда есть множество готовых решений.

3. Будет полезно изучить Node.JS – это технология расширяет область применения Джава-скрипт. Например, при помощи Node.JS можно создавать приложения и полноценные программы для ПК.

Например, фреймворк Angular используется для создания одностраничных приложений, Vue.js – для создания пользовательских интерфейсов.

5. Научитесь использовать системы контроля версий. Самая популярная из них — это GIT. О нем поговорим ниже.

6. Учитесь писать грамотный и правильно структурированный код.

Как наработать опыт и найти работу?

Мы разобрались, как выучить JavaScript с нуля самостоятельно, что нужно осваивать в первую очередь и как быстро набрать опыт. Теперь вы готовы сделать первые шаги. Удачи вам в изучении JS и поиске работы!

Создание объекта Date

Прежде чем мы начнем работать с датой и временем, нам нужно создать объект Date. В отличие от других встроенных объектов, таких как массивы или функции, даты не имеют соответствующей литеральной формы: все объекты даты должны быть созданы с использованием функции конструктора .

Существует четыре различных способа создания объекта Date в JavaScript.

Синтаксис new Date()

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

Синтаксис new Date(year, month, …)

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

Параметры года и месяца обязательные, остальные нет.

Эта дата фактически представляет 31 января 2018 года в 14:35:20 и 50 миллисекунд. Вы можете игнорировать часть времени и указать только часть даты, если хотите.

Синтаксис new Date(dateString)

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

Эта дата представляет собой 31 января 2018 года. Вы можете указать дату в любом допустимом варианте, например Jan 31 2018, JavaScript обработает это автоматически.

Синтаксис new Date(milliseconds)

Вы также можете определить объект Date, передав количество миллисекунд с 1 января 1970 года в 00:00:00 по Гринвичу. Это время известно как UNIX, потому что в 1970 год была создана операционная система UNIX. Вот пример:

Эта дата представляет среду 31 января 2018 года 05:30:00 по Гринвичу (+05:30).

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

JavaScript предоставляет ярлыки, называемые литералами, для создания большей части собственного объекта без необходимости использования оператора , например , и т. д.

Автоматическая коррекция даты

Допустим, мы установили дату на 33 марта 2019 года. (В календаре нет 33 марта). В этом случае JavaScript автоматически переведёт 33 марта во 2 апреля.

// 33е марта => 2е апреля
new Date(2019, 2, 33)

33 марта автоматически преобразуется во 2 апреля.

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

// 33е марта => 2е апреля
new Date(2019, 2, 30 + 3)

30+3=33. 33 марта автоматически преобразуется во 2 апреля.

И это всё, что вам нужно знать о JavaScript-объекте Date.

Пожалуйста, оставляйте ваши мнения по текущей теме статьи. За комментарии, лайки, дизлайки, подписки, отклики низкий вам поклон!

Вадим Дворниковавтор-переводчик статьи «Everything You Need to Know About Date in JavaScript»

Установка значений даты и времени

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

Установка года, месяца и даты

Объект Date предоставляет такие методы, как , и для установки компонентов год, месяц и дата объекта Date соответственно.

Например, в следующем примере мы используем метод для изменения текущей даты, хранящейся в переменной, на два года вперед.

Аналогично, вы можете использовать метод для установки или изменения части месяца объекта Date.

Метод требует целочисленного значения от 0 до 11, если вы установите значение месяца больше 11, значение года объекта даты будет увеличиваться.

Другими словами, значение 12 приводит к тому, что значение года увеличивается на 1, а значение месяца устанавливается на 0, как показано в следующем примере:

Точно так же вы можете изменить часть даты:

Метод требует целочисленного значения от 1 до 31. Кроме того, если вы передадите значения, превышающие количество дней в месяце, месяц будет увеличиваться. Например:

Установка часов, минут и секунд

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

Каждый метод принимает целочисленные значения в качестве параметров. Часы варьируются от 0 до 23. Минуты и секунды от 0 до 59. А миллисекунды от 0 до 999. Вот пример:

Получение даты из другой даты

Чтобы получить дату из другой даты, нужно:

Установить конкретное значение даты/времени из другой даты.
Добавить/вычесть отрезок времени из другой даты.

Установка конкретной даты / времени

Для этого можно использовать следующие методы:

: устанавливает четырехзначный год по местному времени.
: устанавливает месяц года по местному времени.
: устанавливает день месяца по местному времени.
: устанавливает часы по местному времени.
: устанавливает минуты по местному времени.
: устанавливает секунды по местному времени.
: устанавливает миллисекунды по местному времени.

Например, если вы хотите задать дату для 15 числа месяца, вы можете использовать метод .

const d = new Date(2019, 0, 10)
d.setDate(15)
console.log(d) // 15 января 2019

Чтобы установить июнь месяц, примените метод :

const d = new Date(2019, 0, 10)
d.setMonth(5)
console.log(d) // 10 июня 2019

Методы установки значений даты изменяют исходный объект Date(). На практике лучше модифицировать отдельный экземпляр объекта.

const d = new Date(2019, 0, 10)
const newDate = new Date(d)
newDate.setMonth(5)
console.log(d) // 10 января 2019
console.log(newDate) // 10 июня 2019

Добавление/вычитание периода времени из другой даты

Чтобы добавить/вычесть период времени, нужно знать значение текущей даты. Его можно получить с помощью следующих методов:

: возвращает четырехзначный год по местному времени.
: возвращает месяц года (0-11) по местному времени.
: возвращает день месяца (1-31) по местному времени.
: возвращает часы (0-23) по местному времени.
: возвращает минуты (0-59) по местному времени.
: возвращает секунды (0-59) по местному времени.
: возвращает миллисекунды (0-999) по местному времени.

Допустим, что вы хотите назначить свидание через три дня (начиная с сегодняшнего дня). Предположим, что сегодня 28 марта 2019 года.

Первый подход (установка значения)

// Подразумеваем, что сегодня 28 марта 2019
const today = new Date(2019, 2, 28)

Сначала создаем новый объект Date (чтобы не изменять исходный экземпляр объекта):

const finalDate = new Date(today)

С помощью получаем значение, которое хотим изменить:

const currentDate = today.getDate()

Свидание произойдет через три дня. Поэтому добавляем их к текущей дате:

finalDate.setDate(currentDate + 3)

Полный код для первого подхода:

const today = new Date(2019, 2, 28)
const finalDate = new Date(today)
finalDate.setDate(today.getDate() + 3)
console.log(finalDate) // 31 марта 2019

Второй подход (создание новой даты)

Сначала используем , , и другие методы, пока не получим типа значения, которое мы изменить. Затем мы создаём искомую дату при помощи .

const today = new Date(2019, 2, 28)
// Получение нужных значений
const year = today.getFullYear()
const month = today.getMonh()
const day = today.getDate()
// Создание новой даты
const finalDate = new Date(year, month, day + 3)
console.log(finalDate) // 31 марта 2019

Оба подхода работают.

JS сравнение дат

В JavaScript для сравнения дат используются операторы , , и .

const earlier = new Date(2019, 0, 26)
const later = new Date(2019, 0, 27)
console.log(earlier < later) // true

Сложнее сравнить даты по времени суток (часам и минутам). Вы не сможете сравнить их с помощью или :

const a = new Date(2019, 0, 26)
const b = new Date(2019, 0, 26)

console.log(a == b) // false
console.log(a === b) // false

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

const isSameTime = (a, b) => {
  return a.getTime() === b.getTime()
}
const a = new Date(2019, 0, 26)
const b = new Date(2019, 0, 26)
console.log(isSameTime(a, b)) // true

Чтобы проверить, совпадают ли в датах дни недели, сравните их значения с помощью методов , и .

const isSameDay = (a, b) => {
  return a.getFullYear() === b.getFullYear() &&
    a.getMonth() === b.getMonth() &&
    a.getDate()=== b.getDate()
}
const a = new Date(2019, 0, 26, 10) // 26 января 2019, 10:00
const b = new Date(2019, 0, 26, 12) // 26 января 2019, 12:00
console.log(isSameDay(a, b)) // true

Универсальный JavaScript

Компании, разрабатывающие JavaScript, идут не по пути конфронтации друг с другом, а совместно работают над его развитием. Язык полностью удовлетворяет как адептов объектно-ориентированного (ООП), так и функционального подхода к программированию. При помощи JS можно быстро решать практически любые задачи: этому способствует огромное количество библиотек и фреймворков, которые постоянно обновляются или появляются новые. Если раньше JavaScript использовался для фронт-энда, то сегодня при помощи серверной платформы Node.js JS используется как в браузере, так и в консоли.

Кроме того, JS уже вышел за узкие рамки веб-разработки. С его помощью можно создавать десктопные (с использованием фреймворка Electron) и мобильные приложения (NativeScript или React Native).

Извлечение даты с помощью get

Имея дату, вы можете получить доступ ко всем ее компонентам с помощью различных встроенных методов. Методы возвращают каждую часть даты относительно локального часового пояса. Каждый из этих методов начинается с get и возвращает относительное число. Ниже приведена подробная таблица методов get для объекта Date.

Дата/Время	Метод	Диапазон	Пример
Год	getFullYear()	YYYY	1970
Месяц	getMonth()	0-11	0 = January
День месяца	getDate()	1-31	1 = 1st of the month
День недели	getDay()	0-6	0 = Sunday
Час	getHours()	0-23	0 = midnight
Минута	getMinutes()	0-59
Секунда	getSeconds()	0-59
Миллисекунда	getMilliseconds()	0-999
Временная метка	getTime()	Количество миллисекунд с нулевого времени

Создайте новую дату, например 31 июля 1980 года, и присвойте ее переменной.

Теперь можно использовать все методы для извлечения каждого компонента даты.

Иногда бывает необходимо извлечь только часть даты, и встроенные методы get помогут вам в этом.

Например, можно сравнить текущую дату с датой 3 октября, чтобы узнать, 3 октября сейчас или нет.

Поскольку на момент написания мануала было не 3 октября, консоль сообщит, что это не так.

Встроенные методы get позволяют получать доступ к компонентам даты.

Как быстро выучить JavaScript с нуля? Советы для новичков

Старайтесь системно подходить к обучению. Если осваиваете Ява скрипт самостоятельно, то начинайте с основ, затем переходите к более глубокому материалу. Параллельно учите теорию. Что такое алгоритмы, какие они бывают и т.д.
Постоянно практикуйтесь. Начинайте писать свои скрипты или переделывать или дорабатывать скрпиты других разработчиков (их можно найти в интернете). Старайтесь разобраться, как работает чужой код и как он сделан.
Сделайте свой сайт, например, на WordPress и добавляйте на него различные функции. Это будет хорошей практикой.
Если вам что-то не понятно, берите консультации программистов или заказывайте услугу code-review (проверку кода у опытного разработчика с комментариями, что нужно доработать, переделать и почему). Найти опытных разработчиков для code-review можно в каталоге веб-программистов на Kadrof.ru. Данная услуга стоит денег, поэтому заранее уточняйте у людей, которые согласятся проверить ваш код, сколько это будет стоить.
Много полезной информации можно найти на сайте Хабр Q&A. Там общаются разработчики и в том числе можно попросить совет (бесплатно).
На Kadrof.ru есть обзор сайтов для изучения языков программирования. Там вы найдете справочники и самоучители, которые помогут быстро освоить JavaScript.

Где используют язык JavaScript и для чего?

Java Script (Ява или Джава скрипт или сокращенно JS) – один из самых популярных языков программирования в мире. Чаще всего на нем создают интерактивные элементы на сайтах, с помощью которых сайты «оживают», начинают реагировать на действия пользователей. Примеры таких элементов:

Кнопки.
Формы.
Слайдеры.
Фотогалереи.
Виджеты и многое другое.

Однако данный язык востребован не только в создании сайтов. Его используют для разработки прикладных программ, например, браузеров, приложений для SMART-телевизоров, фитнес-трекеров, умных часов, приставок, в макросах для офисных программ. Подробно о сфере применения Джава скрипт можно прочитать в описании профессии JavaScript-разработчика.

Создание даты

Вы можете создать дату, использовав оператор new:

Со строкой даты.
С аргументами даты.
С меткой времени.
Без аргументов.

Способ со строкой даты

Мы передаем строку даты в конструктор .

new Date('1988-03-21')

Но если вы передадите строковое представление даты в формате 21-03-1988, то получите ошибку.

new Date(’21-03-1988′) приводит к ошибке Invalid Date.

В JavaScript нужно использовать формат даты, который принят во всем мире — ISO 8601.

// Расширенный формат ISO 8601
`YYYY-MM-DDTHH:mm:ss:sssZ`

Вот что означают значения:

: 4-значный год;
: двузначный месяц (где январь 01, а декабрь 12);
: двузначная дата (от 01 до 31);
: разделители даты;
: указывает на начало блока времени;
: часы в 24-часовом формате (от 00 до 23);
: минуты (от 00 до 59);
: секунды (от 00 до 59);
: миллисекунды (от 000 до 999);
: разделители времени;
: если присутствует, дата будет установлена в UTC. Если отсутствует, это будет местное время.

Часы, минуты, секунды и миллисекунды необязательны, если вы создаете дату. Если нужно передать дату 11 июня 2019 года:

new Date('2019-06-11')

Но если вы находитесь к востоку от Гринвича, то получите дату 10 июня.

new Date(‘2019-06-11’) выдаёт 10 июня, если вы находитесь к востоку от Гринвича

Если в районе, который опережает время по Гринвичу, то получите дату 11 июня.

new Date(‘2019-06-11’)выдаёт 11 июня, если вы находитесь к западу от Гринвича

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

Строка кода создает дату 11 июня 2019, 12:00 UTC. Вот почему люди, которые живут восточнее Гринвича, получают 10 июня вместо 11 июня.

Если вы хотите создать дату по местному часовому поясу, необходимо указать время. Когда вы включаете в дату время, вам нужно добавить, как минимум, часы и минуты (иначе Google Chrome возвращает недопустимую дату).

new Date('2019-06-11T00:00')

Дата по местному времени и дата в UTC.

Кстати, MDN предостерегает от использования строкового представления даты, поскольку браузеры могут ее трактовать по-разному.

MDN не рекомендует создавать даты с помощью строкового представления.

Создание дат с помощью аргументов

Конструктор Date принимает семь параметров:

Год: четырехзначный год.
Месяц: месяц года (0-11). По умолчанию 0.
День: день месяца (1-31). По умолчанию 1.
Час: час дня (0-23). По умолчанию 0.
Минуты: Минуты (0-59). По умолчанию 0.
Секунды: секунды (0-59). По умолчанию 0.
Миллисекунды: миллисекунды (0-999). По умолчанию 0.

// 11 июня 2019г. 5:23:59 местного времени
new Date(2019, 5, 11, 5, 23, 59)

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

new Date(2017, 3, 22, 5, 23, 50)
// Эту дату легко понять, если читать ее слева направо.
// Год: 2017
// Месяц: апрель (потому что месяца считаются с 0)
// Дата: 22
// Часы: 05
// Минут: 23
// Секунды: 50

Но помните, что порядок месяца начинаются с нуля. Например, январь – 0, февраль – 1, март – 2 и т. д.

Вот еще несколько примеров для закрепления:

// 21 марта 1988г. 00:00 местного времени
new Date(1988, 2, 21)
// 25 декабря 2019г. 8:00 местного времени 
new Date(2019, 11, 25, 8)
// 6 ноября 2023г. 2:20 местного времени
new Date(2023, 10, 6, 2, 20)
// 11 июня 2019г. 5:23:59 местного времени
new Date(2019, 5, 11, 5, 23, 59)

Даты, созданные с помощью аргументов, указаны по местному времени. Если вам понадобится дата в формате UTC, используйте следующий синтаксис:

// 11 июня 2019 00:00 UTC.
new Date(Date.UTC(2019, 5, 11))

Создание дат с помощью меток времени

В JavaScript метка времени – это количество миллисекунд, прошедших с 1 января 1970 г. (от начала эпохи Unix). Метки времени используются только для сравнения различных дат.

// 11 июня 2019 8:00 (по моему местному времени в Сингапуре)
new Date(1560211200000)

Без аргументов

Если использовать конструктор объекта Date() без аргументов, то он возвращает дату по местному времени.

new Date()

Текущее время.

С чего начать изучение JavaScript и сколько времени это займет?

Как в любом языке, в JavaScript имеются определенные команды и правила их составления. Начать изучение этого языка можно со следующих вещей:

Структура кода (как составляется программа, с чего начинается, в какой последовательности задаются команды и т.д.).
Переменные (что это такое, для чего нужны, как задаются и используются в скриптах).
Типы данных, например: число, строка, логический тип, и преобразование типов.
Операторы, например, как производится сложение. Приоритет операторов (какие действия выполняются в первую очередь, какие – во вторую и т.д.). Бывают операторы сравнения, условные операторы, логические.
Выучить, как использовать циклы (что это такое, для чего нужны, как их задавать). Говоря простыми словами, циклы позволяют производить одну и ту же операцию несколько раз (пока не наступит условие, которое завершит цикл).
Функции.
Объекты и их свойства.
Прототипы, наследование.
Классы и наследование классов.
Интерфейсные события (обработка движения курсора, кликов мышки, нажатия кнопок на клавиатуре).
Программирование элементов интерфейса: кнопок, форм и других.
Выучить, как писать асинхронный код на JavaScript.
Отладка программ в браузере, написанных на JS.
Обработка ошибок.
Качество кода: как писать программу правильно, чтобы в ней было легко и просто ориентироваться как автору, так и другому разработчику.

Изучить основы можно самостоятельно, например, пользуясь самоучителем Learn.javascript.ru или Html5css.ru. На втором сайте курс интерактивный. Можно прямо в браузере смотреть пример кода и как он работает (какие события обрабатывает и как).

Выучить простейшие азы можно за срок от 2-3 недель до 1,5 месяцев в зависимости от времени, которое вы сможете уделять программированию каждый день. Далее вам потребуется более глубоко погружаться в предметную область, о чем поговорим ниже.

Для изучения JavaScript пригодится знание HTML и CSS. Если вы еще не знаете эти технологии, то освоить их можно на бесплатном курсе в Нетологии. На нем расскажут, что такое HTML-теги, для чего они нужны и покажут основные теги и их атрибуты.

Методы UTC

Методы get, описанные выше, извлекают компоненты даты на основе локальных настроек часового пояса пользователя. Чтобы увеличить контроль над датами и временем, вы можете использовать методы getUTC, которые работают так же, как методы get, но вычисляют время, основанное на стандарте UTC (всемирное координированное время). Ниже приведена таблица методов UTC для объекта Date в JavaScript.

Дата/Время	Метод	Диапазон	Пример
Год	getUTCFullYear()	YYYY	1970
Месяц	getUTCMonth()	0-11	0 = January
День месяца	getUTCDate()	1-31	1 = 1st of the month
День недели	getUTCDay()	0-6	0 = Sunday
Час	getUTCHours()	0-23	0 = midnight
Минута	getUTCMinutes()	0-59
Секунда	getUTCSeconds()	0-59
Миллисекунда	getUTCMilliseconds()	0-999

Чтобы проверить разницу между локальными методами get и методами get UTC, запустите следующий код.

Этот код выведет текущее время и время по часовому поясу UTC. Если вы сейчас находитесь в часовом поясе UTC, то числа, которые выведет программа, будут одинаковыми.

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

Получение конкретных компонентов даты и времени

Если у вас есть подходящий объект даты, вам доступен ряд методов для его извлечения, например, значение месяца, даты, часов, минут и т. д. Теперь рассмотрим различные методы извлечения отдельных фрагментов информации из объекта Date.

Получение года, месяца и даты

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

Метод возвращает число, представляющее день недели (от 0 до 6), вместо возврата имени, такого как воскресенье или понедельник, таким образом, если день — воскресенье, метод возвращает 0; и если день — понедельник, метод возвращает 1 и так далее.

Аналогично, метод возвращает количество месяцев (от 0 до 11) вместо имени месяца. Здесь 0 представляет первый месяц года. Поэтому, если это январь, метод возвращается 0, а не 1; а если это август, метод возвращает 7.

Получение часов, минут, секунд и миллисекунд

Аналогично, объект Date предоставляет такие методы, как , , , и т. д. для получения компонентов времени из объекта Date.

Метод возвращает количество часов в дне (от 0 до 23) согласно 24-часовым часам. Когда наступает полночь, метод возвращает 0; в 3:00 дня метод возвращает 15.

У объектов Date также есть методы для получения компонентов UTC. Просто поместите UTC после get, например , , и так далее.

Изменение даты с помощью set

Для всех перечисленных выше методов get существует соответствующий метод set. Если get используется для извлечения определенного компонента даты, set используется для изменения этих компонентов. Ниже приведена подробная таблица методов set для объекта Date.

Дата/Время	Метод	Диапазон	Пример
Год	setFullYear()	YYYY	1970
Месяц	setMonth()	0-11	0 = January
День месяца	setDate()	1-31	1 = 1st of the month
День недели	setDay()	0-6	0 = Sunday
Час	setHours()	0-23	0 = midnight
Минута	setMinutes()	0-59
Секунда	setSeconds()	0-59
Миллисекунда	setMilliseconds()	0-999
Временная метка	setTime()	Количество миллисекунд с нулевого времени

Эти методы set можно использовать для изменения одного или нескольких компонентов даты. Например, можно изменить год в переменной birthday на 1997.

Теперь при вызове переменной birthday вы видите не 1980, а 1997 год.

Встроенные методы set позволяют изменять разные части объекта Date.

Заключение

Итак, карта местности готова, теперь можно сверстать маршрут движения по просторам фронт-энда:

1. 1. Изучите базовые основы вёрстки — HTML, CSS, все тонкости вы не запомните, а все остальное придет в процессе практической работы. Более подробно следует изучить Flexboxи CSS grid.
  2. Разберитесь с Bootstrap или bulma.io. Обучение можно проводить «на лету», создавая с помощью предоставляемых исходников небольшие проекты.
  3. Изучите JavaScript. Тут ситуация та же: просмотрите синтаксис ES6, чтобы его понимать. Разберитесь на практике, как реализованы те или иные UI-компоненты в вышеупомянутых CSS-фреймворках.
  4. Изучите основы Git. Это система контроля версий, и она уже на данном этапе хорошо вам послужит, позволит фиксировать поэтапно изменения в коде и хранить их.
  5. Изучите BEM/SuitCSS, на выбор.
  6. Разберитесь с синтаксисом Stylusи Pug.
  7. Изучайте документацию js. В процессе изучения вам придется рассматривать множество смежных вещей — компонентная архитектура, сборка с помощью webpack, работа с API, SSR, flux, автотестирование. При этом вы разберетесь в их взаимосвязях и назначениях.
  8. Посмотрите библиотеку lodash. В ней много полезного, что поможет более лаконично писать код на JavaScript.
  9. Изучите автотестирование фронтенда. Этим вы изначально облегчите себе дальнейшую работу ( Jest, TestCafe). В Vue.js есть хороший инструментарий для автотестов из коробки.
  10. Пробуйте создать собственное приложение. Если на первых этапах нет идей – разберите любое приложения, поймите его идею, способ реализации. Попробуйте расширить его, добавить свои дополнительные функции.
  11. В дополнение изучите популярные сегодня транслируемые в JavaScript языки — TypeScript, CoffeeScript.

И последнее: у юристов есть хорошая пословица. Хороший юрист не тот, кто наизусть знает какой-либо кодекс. Хороший юрист тот, кто знает, какие кодексы есть, на какой полке они лежат и для чего их использовать.

Создано по материалам сайтов:

tproger.ru, developer.mozilla.org, habr.com, medium.com, и других, ссылки на которые есть в материале.

Читайте больше по теме: