Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JS: Исправляет ошибки и форматирует (часть 4) #5279

Merged
merged 6 commits into from
Apr 12, 2024
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
75 changes: 31 additions & 44 deletions js/date/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,9 @@ tags:
`Date` — класс для работы со временем. В основном используется для отображения и вычисления.

Время отображается в двух форматах:
1) UTC — время по Гринвичу;
2) В текущей часовой зоне (например, UTC+3 для Москвы).

1. UTC — время по Гринвичу.
1. В текущей часовой зоне (например, UTC+3 для Москвы).

Поэтому часть методов для взаимодействия со временем имеют два формата — для UTC и для текущей часовой зоны.

Expand Down Expand Up @@ -96,13 +97,13 @@ console.log(utcDate.toISOString())

Создать новый экземпляр класса можно несколькими способами:

- `new Date()` создаёт экземпляр `Date` с текущей датой и временем.
`new Date()` создаёт экземпляр `Date` с текущей датой и временем.

- `new Date(значение)` создаёт `Date` с переданным значением времени. Значение должно быть в формате, который распознается методом `Date.parse()`, то есть быть совместимым с [IETF RFC 2822](https://www.rfc-editor.org/rfc/rfc2822#page-14) или с [ISO8601](https://es5.javascript.ru/x15.9.html#x15.9.1.15).
`new Date(значение)` создаёт `Date` с переданным значением времени. Значение должно быть в формате, который распознается методом `Date.parse()`, то есть быть совместимым с [IETF RFC 2822](https://www.rfc-editor.org/rfc/rfc2822#page-14) или с [ISO8601](https://es5.javascript.ru/x15.9.html#x15.9.1.15).

- `new Date(год, месяц, день, часы, минуты, секунды, миллисекунды)` создаёт класс `Date` в местной часовой зоне. Год и месяц являются обязательными параметрами. Остальные параметры, начиная с часов, будут по умолчанию равны 0, а день — 1.
`new Date(год, месяц, день, часы, минуты, секунды, миллисекунды)` создаёт класс `Date` в местной часовой зоне. Год и месяц являются обязательными параметрами. Остальные параметры, начиная с часов, будут по умолчанию равны 0, а день — 1.

- `new Date(миллисекунды)` создаёт `Date` со временем в миллисекундах. Количество миллисекунд измеряется с 1 января 1970 года UTC.
`new Date(миллисекунды)` создаёт `Date` со временем в миллисекундах. Количество миллисекунд измеряется с 1 января 1970 года UTC.

```js
const millisecondsDate = new Date(120000)
Expand All @@ -124,16 +125,15 @@ console.log(millisecondsDate.toISOString())
- `getDate()` — возвращает день месяца с 1 до 31;
- `getDay()` — возвращает порядковый номер дня недели с 0 до 6;
- `getHours()` — возвращает часы с 0 до 23;
- `getMinutes()` - возвращает минуты от 0 до 59;
- `getSeconds()` - возвращает секунды от 0 до 59;
- `getMilliseconds()` - возвращает миллисекунды от 0 до 999.
- `getMinutes()` возвращает минуты от 0 до 59;
- `getSeconds()` возвращает секунды от 0 до 59;
- `getMilliseconds()` возвращает миллисекунды от 0 до 999.

Все вышеперечисленные методы возвращают значения для текущей часовой зоны. Если необходимо вернуть время по Гринвичу, то нужно в метод добавить UTC: `getUTCFullYear()`, `getUTCMonth()`, `getUTCDate()`, `getUTCDay()`, `getUTCHours()`, `getUTCMinutes()`,
`getUTCSeconds()`, `getUTCMilliseconds()`.
Все вышеперечисленные методы возвращают значения для текущей часовой зоны. Если необходимо вернуть время по Гринвичу, то нужно в метод добавить UTC: `getUTCFullYear()`, `getUTCMonth()`, `getUTCDate()`, `getUTCDay()`, `getUTCHours()`, `getUTCMinutes()`, `getUTCSeconds()`, `getUTCMilliseconds()`.

Есть два метода, которые не привязаны к часовой зоне:

- `getTime()` возвращает значение в миллисекундах, прошедших с 1 января 1970 года, соответствующее указанной дате по UTC.
`getTime()` возвращает значение в миллисекундах, прошедших с 1 января 1970 года, соответствующее указанной дате по UTC.

```js
const currentDate = new Date(2022, 11)
Expand All @@ -145,7 +145,7 @@ console.log(currentDate.getTime())
// 1672520400000
```

- `getTimezoneOffset()` возвращает смещение в минутах между текущей часовой зоной и UTC.
`getTimezoneOffset()` возвращает смещение в минутах между текущей часовой зоной и UTC.

```js
const currentDate = new Date()
Expand All @@ -158,19 +158,17 @@ console.log(currentDate.getTimezoneOffset())

Также, как и с получением значений, у многих методов есть присваивание значений в локальной часовой зоне и UTC. Для локальной:

- `setFullYear(год, месяц, день)` устанавливает год, значения месяца и дня необязательны.
- `setMonth(месяц, день)` устанавливает месяц, передавать день необязательно.
- `setDate(день)` устанавливает день месяца.
- `setHours(часы, минуты, секунды, миллисекунды)` устанавливает часы. Значения минут, секунд, миллисекунд необязательны.
- `setMinutes(минуты, секунды, миллисекунды)` - устанавливает минуты. Секунды и миллисекунды необязательны.
- `setSeconds(секунды, миллисекунды)` устанавливает секунды. Миллисекунды передавать необязательно.
- `setMilliseconds(миллисекунды)` - устанавливает миллисекунды.
- `setFullYear(год, месяц, день)` устанавливает год, значения месяца и дня необязательны.
- `setMonth(месяц, день)` устанавливает месяц, передавать день необязательно.
- `setDate(день)` устанавливает день месяца.
- `setHours(часы, минуты, секунды, миллисекунды)` устанавливает часы. Значения минут, секунд, миллисекунд необязательны.
- `setMinutes(минуты, секунды, миллисекунды)` устанавливает минуты. Секунды и миллисекунды необязательны.
- `setSeconds(секунды, миллисекунды)` устанавливает секунды. Миллисекунды передавать необязательно.
- `setMilliseconds(миллисекунды)` устанавливает миллисекунды.

Для UTC аналогичные методы, только добавляем UTC после set. Например, `setUTCMilliseconds(миллисекунды)`.

И метод, который относится только к UTC:

- `setTime(значение)` устанавливает значение, которое равно количеству миллисекунд, прошедших с 1 января 1970 года.
И метод, который относится только к UTC, — `setTime(значение)` устанавливает значение, которое равно количеству миллисекунд, прошедших с 1 января 1970 года.

#### Разбор даты

Expand Down Expand Up @@ -198,40 +196,28 @@ console.log(Date.parse('2022-11-30T21:00:00.000Z'))
Опции — необязательный параметр с объектом настроек. Доступные свойства:

- `localeMatcher` — алгоритм поиска локали, используется для выбора подходящей локали. Принимает значения [`lookup`](https://tc39.es/ecma402/#sec-lookupsupportedlocales) или [`best fit`](https://tc39.es/ecma402/#sec-bestfitsupportedlocales). По умолчанию `best fit`.

- `timeZone` — значение используемого часовой зоны. Все браузеры должны принимать значение `UTC`, значение по умолчанию равно значению часовой зоны среды выполнения. Формат принимаемого значения может различаться в различных браузерах.

- `hour12` — значение, которое определяет, использовать ли 12-часовой формат вывода. Принимает `true` или `false`.

- `formatMatcher` — алгоритм поиска формата, используется для выбора формата отображения. Принимает значения [`basic`](https://402.ecma-international.org/1.0/#BasicFormatMatcher) или [`best fit`](https://tc39.es/ecma402/#sec-bestfitformatmatcher). По умолчанию `best fit`.

- `timeZoneName` — формат названия часовой зоны. Принимает `long` или `short`.

- `weekday` — значение дня недели. Принимает `narrow`, `short` и `long`.

- `era` — значение эры. Принимает `narrow`, `short` и `long`.

- `year` — значение года. Принимает `numeric` и `2-digit`.

- `month` — значения месяца. Принимает `numeric`, `2-digit`, `narrow`, `short` и `long`.

- `day` — значения дня. Принимает `numeric` и `2-digit`.

- `hour` — значения часа. Принимает `numeric` и `2-digit`.

- `minute` — значения минут. Принимает `numeric` и `2-digit`.

- `second` — значения секунд. Принимает `numeric` и `2-digit`.

Браузеры обязаны поддерживать следующие наборы настроек отображения:

- `weekday`, `year`, `month`, `day`, `hour`, `minute`, `second`
- `weekday`, `year`, `month`, `day`
- `year`, `month`, `day`
- `year`, `month`
- `month`, `day`
- `hour`, `minute`, `second`
- `hour`, `minute`
- `weekday`, `year`, `month`, `day`, `hour`, `minute`, `second`;
- `weekday`, `year`, `month`, `day`;
- `year`, `month`, `day`;
- `year`, `month`;
- `month`, `day`;
- `hour`, `minute`, `second`;
- `hour`, `minute`.

Некоторые браузеры могут поддерживать форматы вывода сверх этих наборов, но данный момент необходимо уточнять в спецификации браузеров.

Expand Down Expand Up @@ -267,14 +253,15 @@ console.log(Date.now())

Найдём количество дней между 1 января 2022 и 31 декабря 2022.

Полученное значение = количество дней в году - 1.
Полученное значение равно количеству дней в году минус 1.

```js
const utcDateOne = new Date(Date.UTC(2022, 0, 1, 0, 0, 0))
const utcDateTwo = new Date(Date.UTC(2022, 11, 31, 0, 0, 0))

console.log(utcDateOne.toUTCString())
// Sat, 01 Jan 2022 00:00:00 GMT

console.log(utcDateTwo.toUTCString())
// Sat, 31 Dec 2022 00:00:00 GMT

Expand Down Expand Up @@ -353,7 +340,7 @@ const options = {

console.log(new Intl.DateTimeFormat('ru-RU', options).format(currentDate))
// 14.08.2022, 14:15:30 Москва, стандартное время

console.log(new Intl.DateTimeFormat('en-US', options).format(currentDate))
// 8/14/2022, 2:15:30 PM Moscow Standard Time
```

13 changes: 7 additions & 6 deletions js/date/practice/kseniaSs.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@

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

Основные отличия:
Основные отличия.

- В поддержке браузеров. `Intl.DateTimeFormat` поддерживается не всеми древними браузерами.
В поддержке браузеров. `Intl.DateTimeFormat` поддерживается не всеми древними браузерами.

- Вы можете использовать `Intl.DateTimeFormat` для форматирования групп дат. В отличие от `toLocaleDateString()`, он позволяет установить формат один раз.
Вы можете использовать `Intl.DateTimeFormat` для форматирования групп дат. В отличие от `toLocaleDateString()`, он позволяет установить формат один раз.

```js
const dateOne = new Date('August 14, 2022 14:15:30')
Expand All @@ -23,11 +23,12 @@ const formatter = new Intl.DateTimeFormat('ru-RU', options)

console.log(formatter.format(dateOne))
// 14.08.2022, 11:15:30 Всемирное координированное время

console.log(formatter.format(dateTwo))
// 26.12.1991, 0:00:30 Всемирное координированное время
```

- Различный ввод/вывод. Так как стандарт не является строгим, то передаваемые параметры могут отличаться. Особенно это касается часовых зон. Значения вывода по умолчанию также могут отличаться.
Различный ввод или вывод. Так как стандарт не является строгим, то передаваемые параметры могут отличаться. Особенно это касается часовых зон. Значения вывода по умолчанию также могут отличаться.

```js
const date = new Date(1660475730000)
Expand All @@ -39,8 +40,8 @@ console.log(new Intl.DateTimeFormat('en-US').format(date))
// 8/14/2022
```

Поэтому, если вам не так критично поддерживать браузеры, с маленьким процентом использования клиентами, то я советую использовать `Intl.DateTimeFormat`.
Поэтому, если вам не так критично поддерживать браузеры, с маленьким процентом использования клиентами, то советую использовать `Intl.DateTimeFormat`.

🛠 Если вам не хватает функциональности, представленной классом `Date`, например, недостаточно его возможностей форматирования или парсинга, то можно посмотреть в сторону библиотек [day.js](https://day.js.org/docs/en/installation/installation) или [date-fns](https://date-fns.org/docs/Getting-Started).

Раньше золотым стандартом была библиотека [moment.js](https://momentjs.com/). Сейчас использовать её не рекомендуется, так как она сильно увеличивает размер собранного приложения. Не добавляйте её в новые проекты.
🛠 Раньше золотым стандартом была библиотека [moment.js](https://momentjs.com/). Сейчас использовать её не рекомендуется, так как она сильно увеличивает размер собранного приложения. Не добавляйте её в новые проекты.
Loading
Loading