update js
This commit is contained in:
@@ -11,3 +11,5 @@ sidebar_position: 1
|
|||||||
Use strict по умолчанию выключен в консоли браузера
|
Use strict по умолчанию выключен в консоли браузера
|
||||||
|
|
||||||
Современный JavaScript поддерживает «классы» и «модули» — продвинутые структуры языка (и мы, конечно, до них доберёмся), которые автоматически включают строгий режим.
|
Современный JavaScript поддерживает «классы» и «модули» — продвинутые структуры языка (и мы, конечно, до них доберёмся), которые автоматически включают строгий режим.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/strict-mode](https://learn.javascript.ru/strict-mode)**
|
||||||
@@ -93,3 +93,5 @@ typeof function(){} == "function" // именно для функций
|
|||||||
alert("Выражение начинается с унарного плюса");
|
alert("Выражение начинается с унарного плюса");
|
||||||
}();
|
}();
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/variables](https://learn.javascript.ru/variables)**
|
||||||
@@ -53,3 +53,5 @@ alert( Boolean(0) ); // false
|
|||||||
alert( Boolean("Привет!") ); // true
|
alert( Boolean("Привет!") ); // true
|
||||||
alert( Boolean("") ); // false
|
alert( Boolean("") ); // false
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/types](https://learn.javascript.ru/types)**
|
||||||
@@ -37,3 +37,5 @@ let a = (1 + 2, 3 + 4);
|
|||||||
alert( a ); // 7 (результат вычисления 3 + 4)
|
alert( a ); // 7 (результат вычисления 3 + 4)
|
||||||
```
|
```
|
||||||
❗ ***Запятая имеет очень низкий приоритет***
|
❗ ***Запятая имеет очень низкий приоритет***
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/operators](https://learn.javascript.ru/operators)**
|
||||||
@@ -41,3 +41,4 @@ sidebar_position: 5
|
|||||||
При использовании математических операторов и других операторов сравнения \< \> \<= \>=
|
При использовании математических операторов и других операторов сравнения \< \> \<= \>=
|
||||||
Значения null/undefined преобразуются к числам: `null` становится 0, а `undefined` – NaN.
|
Значения null/undefined преобразуются к числам: `null` становится 0, а `undefined` – NaN.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/comparison](https://learn.javascript.ru/comparison)**
|
||||||
@@ -177,3 +177,7 @@ let userAge = null;
|
|||||||
userAge ??= 18;
|
userAge ??= 18;
|
||||||
alert(userAge) // 18
|
alert(userAge) // 18
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🚀 **Источник if-else: [https://learn.javascript.ru/ifelse](https://learn.javascript.ru/ifelse)**
|
||||||
|
🚀 **Источник logical ops: [https://learn.javascript.ru/logical-operators](https://learn.javascript.ru/logical-operators)**
|
||||||
|
🚀 **Источник nullish ops: [https://learn.javascript.ru/nullish-operators](https://learn.javascript.ru/nullish-operators)**
|
||||||
@@ -38,3 +38,5 @@ for (let i = 0; i < 3; i++) {
|
|||||||
```js
|
```js
|
||||||
(i > 5) ? alert(i) : continue; // continue здесь приведёт к ошибке
|
(i > 5) ? alert(i) : continue; // continue здесь приведёт к ошибке
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/while-for](https://learn.javascript.ru/while-for)**
|
||||||
@@ -2,7 +2,6 @@
|
|||||||
sidebar_position: 8
|
sidebar_position: 8
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
# Сборка мусора
|
# Сборка мусора
|
||||||
|
|
||||||
Управление памятью в JavaScript выполняется автоматически и незаметно. Мы создаём примитивы, объекты, функции… Всё это занимает память.
|
Управление памятью в JavaScript выполняется автоматически и незаметно. Мы создаём примитивы, объекты, функции… Всё это занимает память.
|
||||||
@@ -51,3 +50,5 @@ sidebar_position: 8
|
|||||||
- Сборка мусора выполняется автоматически. Мы не можем ускорить или предотвратить её.
|
- Сборка мусора выполняется автоматически. Мы не можем ускорить или предотвратить её.
|
||||||
- Объекты сохраняются в памяти, пока они достижимы.
|
- Объекты сохраняются в памяти, пока они достижимы.
|
||||||
- Если на объект есть ссылка – вовсе не факт, что он является достижимым (из корня): набор взаимосвязанных объектов может стать недоступен в целом.
|
- Если на объект есть ссылка – вовсе не факт, что он является достижимым (из корня): набор взаимосвязанных объектов может стать недоступен в целом.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/garbage-collection](https://learn.javascript.ru/garbage-collection)**
|
||||||
@@ -6,17 +6,14 @@ sidebar_position: 1
|
|||||||
Объекты – это ассоциативные массивы с рядом дополнительных возможностей.
|
Объекты – это ассоциативные массивы с рядом дополнительных возможностей.
|
||||||
|
|
||||||
Они хранят свойства (пары ключ-значение), где:
|
Они хранят свойства (пары ключ-значение), где:
|
||||||
|
|
||||||
- Ключи свойств должны быть строками или символами (обычно строками).
|
- Ключи свойств должны быть строками или символами (обычно строками).
|
||||||
- Значения могут быть любого типа.
|
- Значения могут быть любого типа.
|
||||||
|
|
||||||
Чтобы получить доступ к свойству, мы можем использовать:
|
Чтобы получить доступ к свойству, мы можем использовать:
|
||||||
|
|
||||||
- Запись через точку: obj.property.
|
- Запись через точку: obj.property.
|
||||||
- Квадратные скобки obj["property"]. Квадратные скобки позволяют взять ключ из переменной, например, obj[varWithKey].
|
- Квадратные скобки obj["property"]. Квадратные скобки позволяют взять ключ из переменной, например, obj[varWithKey].
|
||||||
|
|
||||||
Дополнительные операторы:
|
Дополнительные операторы:
|
||||||
|
|
||||||
- Удаление свойства: delete obj.prop.
|
- Удаление свойства: delete obj.prop.
|
||||||
- Проверка существования свойства: "key" in obj.
|
- Проверка существования свойства: "key" in obj.
|
||||||
- Перебор свойств объекта: цикл for for (let key in obj).
|
- Перебор свойств объекта: цикл for for (let key in obj).
|
||||||
@@ -118,3 +115,5 @@ for (let key in user) {
|
|||||||
```
|
```
|
||||||
### Упорядочение свойств объекта
|
### Упорядочение свойств объекта
|
||||||
Cвойства упорядочены особым образом: свойства с целочисленными ключами сортируются по возрастанию, остальные располагаются в порядке создания.
|
Cвойства упорядочены особым образом: свойства с целочисленными ключами сортируются по возрастанию, остальные располагаются в порядке создания.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/object](https://learn.javascript.ru/object)**
|
||||||
@@ -74,3 +74,5 @@ let clone = JSON.parse(JSON.stringify(obj))
|
|||||||
|
|
||||||
#### Метод structuredClone (deep)
|
#### Метод structuredClone (deep)
|
||||||
Мы можем использовать глобальный метод ***structuredClone()***, который позволяет сделать полную копию объекта. К сожалению он поддерживается только современными браузерами.
|
Мы можем использовать глобальный метод ***structuredClone()***, который позволяет сделать полную копию объекта. К сожалению он поддерживается только современными браузерами.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/object-copy](https://learn.javascript.ru/object-copy)**
|
||||||
@@ -38,3 +38,5 @@ let user = {
|
|||||||
2. Значение `this` определяется во время исполнения кода.
|
2. Значение `this` определяется во время исполнения кода.
|
||||||
- При объявлении любой функции в ней можно использовать `this`, но этот `this` не имеет значения до тех пор, пока функция не будет вызвана.
|
- При объявлении любой функции в ней можно использовать `this`, но этот `this` не имеет значения до тех пор, пока функция не будет вызвана.
|
||||||
- Когда функция вызывается синтаксисом «метода» – ***object.method()***, значением `this` во время вызова является `object`.
|
- Когда функция вызывается синтаксисом «метода» – ***object.method()***, значением `this` во время вызова является `object`.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/object-methods](https://learn.javascript.ru/object-methods)**
|
||||||
@@ -32,3 +32,5 @@ function User(name) {
|
|||||||
Итого:
|
Итого:
|
||||||
- Функции-конструкторы или просто конструкторы, являются обычными функциями, но существует общепринятое соглашение именовать их с заглавной буквы.
|
- Функции-конструкторы или просто конструкторы, являются обычными функциями, но существует общепринятое соглашение именовать их с заглавной буквы.
|
||||||
- Функции-конструкторы следует вызывать только с помощью `new`. Такой вызов подразумевает создание пустого `this` в начале и возврат заполненного в конце.
|
- Функции-конструкторы следует вызывать только с помощью `new`. Такой вызов подразумевает создание пустого `this` в начале и возврат заполненного в конце.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/constructor-new](https://learn.javascript.ru/constructor-new)**
|
||||||
@@ -34,3 +34,5 @@ user?.name = "John"; // Ошибка, не работает
|
|||||||
Как мы видим, все они просты и понятны в использовании. ?. проверяет левую часть на `null/undefined` и позволяет продолжить вычисление, если это не так.
|
Как мы видим, все они просты и понятны в использовании. ?. проверяет левую часть на `null/undefined` и позволяет продолжить вычисление, если это не так.
|
||||||
|
|
||||||
Цепочка ?. позволяет безопасно получать доступ к вложенным свойствам.
|
Цепочка ?. позволяет безопасно получать доступ к вложенным свойствам.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/optional-chaining](https://learn.javascript.ru/optional-chaining)**
|
||||||
@@ -42,3 +42,5 @@ alert(id1 == id2); // false
|
|||||||
использовать их, чтобы изменять встроенное поведение ряда объектов. Например, в дальнейших главах мы будем
|
использовать их, чтобы изменять встроенное поведение ряда объектов. Например, в дальнейших главах мы будем
|
||||||
использовать Symbol.iterator для итераторов, Symbol.toPrimitive для настройки преобразования объектов в примитивы и
|
использовать Symbol.iterator для итераторов, Symbol.toPrimitive для настройки преобразования объектов в примитивы и
|
||||||
так далее.
|
так далее.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/symbol](https://learn.javascript.ru/symbol)**
|
||||||
@@ -7,7 +7,6 @@ sidebar_position: 7
|
|||||||
Преобразование объекта в примитив вызывается автоматически многими встроенными функциями и операторами, которые ожидают примитив в качестве значения.
|
Преобразование объекта в примитив вызывается автоматически многими встроенными функциями и операторами, которые ожидают примитив в качестве значения.
|
||||||
|
|
||||||
Существует всего 3 типа (хинта) для этого:
|
Существует всего 3 типа (хинта) для этого:
|
||||||
|
|
||||||
- "string" (для alert и других операций, которым нужна строка)
|
- "string" (для alert и других операций, которым нужна строка)
|
||||||
- "number" (для математических операций)
|
- "number" (для математических операций)
|
||||||
- "default" (для некоторых других операторов, обычно объекты реализуют его как "number")
|
- "default" (для некоторых других операторов, обычно объекты реализуют его как "number")
|
||||||
@@ -15,7 +14,6 @@ sidebar_position: 7
|
|||||||
Спецификация явно описывает для каждого оператора, какой ему следует использовать хинт.
|
Спецификация явно описывает для каждого оператора, какой ему следует использовать хинт.
|
||||||
|
|
||||||
Алгоритм преобразования таков:
|
Алгоритм преобразования таков:
|
||||||
|
|
||||||
1. Сначала вызывается метод `obj[Symbol.toPrimitive](hint)`, если он существует,
|
1. Сначала вызывается метод `obj[Symbol.toPrimitive](hint)`, если он существует,
|
||||||
2. В случае, если хинт равен "string"
|
2. В случае, если хинт равен "string"
|
||||||
- происходит попытка вызвать `obj.toString()` и `obj.valueOf()`, смотря что есть.
|
- происходит попытка вызвать `obj.toString()` и `obj.valueOf()`, смотря что есть.
|
||||||
@@ -25,3 +23,5 @@ sidebar_position: 7
|
|||||||
Все эти методы должны возвращать примитив (если определены).
|
Все эти методы должны возвращать примитив (если определены).
|
||||||
|
|
||||||
На практике часто бывает достаточно реализовать только `obj.toString()` в качестве универсального метода для преобразований к строке, который должен возвращать удобочитаемое представление объекта для целей логирования или отладки.
|
На практике часто бывает достаточно реализовать только `obj.toString()` в качестве универсального метода для преобразований к строке, который должен возвращать удобочитаемое представление объекта для целей логирования или отладки.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/object-toprimitive](https://learn.javascript.ru/object-toprimitive)**
|
||||||
@@ -75,3 +75,5 @@ user.name = ""; // Имя слишком короткое...
|
|||||||
|
|
||||||
## Использование для совместимости
|
## Использование для совместимости
|
||||||
У аксессоров есть интересная область применения – они позволяют в любой момент взять «обычное» свойство и изменить его поведение, поменяв на геттер и сеттер.
|
У аксессоров есть интересная область применения – они позволяют в любой момент взять «обычное» свойство и изменить его поведение, поменяв на геттер и сеттер.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/property-accessors](https://learn.javascript.ru/property-accessors)**
|
||||||
@@ -15,8 +15,6 @@ sidebar_position: 1
|
|||||||
- Может хранить множество значений как свойства.
|
- Может хранить множество значений как свойства.
|
||||||
- Объявляется при помощи фигурных скобок \{\}, например: \{name: "Рома", age: 30\}. В JavaScript есть и другие виды объектов: например, функции тоже являются объектами.
|
- Объявляется при помощи фигурных скобок \{\}, например: \{name: "Рома", age: 30\}. В JavaScript есть и другие виды объектов: например, функции тоже являются объектами.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Примитив как объект
|
## Примитив как объект
|
||||||
1. Примитивы остаются примитивами. Одно значение, как и хотелось.
|
1. Примитивы остаются примитивами. Одно значение, как и хотелось.
|
||||||
2. Язык позволяет осуществлять доступ к методам и свойствам строк, чисел, булевых значений и символов.
|
2. Язык позволяет осуществлять доступ к методам и свойствам строк, чисел, булевых значений и символов.
|
||||||
@@ -25,4 +23,6 @@ sidebar_position: 1
|
|||||||
Каждый примитив имеет свой собственный «объект-обёртку», которые называются: **`String`**, **`Number`**, **`Boolean`**, **`Symbol`** и **`BigInt`**. Таким образом, они имеют разный набор методов.
|
Каждый примитив имеет свой собственный «объект-обёртку», которые называются: **`String`**, **`Number`**, **`Boolean`**, **`Symbol`** и **`BigInt`**. Таким образом, они имеют разный набор методов.
|
||||||
|
|
||||||
💥 ***null/undefined не имеют методов*** \
|
💥 ***null/undefined не имеют методов*** \
|
||||||
Попытка доступа к свойствам такого значения возвратит ошибку:
|
Попытка доступа к свойствам такого значения возвратит ошибку
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/primitives-methods](https://learn.javascript.ru/primitives-methods)**
|
||||||
@@ -121,3 +121,5 @@ alert( parseInt('a123') ); // NaN
|
|||||||
|
|
||||||
### Другие математические функции
|
### Другие математические функции
|
||||||
В JavaScript встроен объект **Math**, который содержит различные математические функции и константы.
|
В JavaScript встроен объект **Math**, который содержит различные математические функции и константы.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/number](https://learn.javascript.ru/number)**
|
||||||
@@ -93,3 +93,5 @@ str.substr(start [, length]) // - возвращает часть строки
|
|||||||
- Отрицательное число, если str меньше str2.
|
- Отрицательное число, если str меньше str2.
|
||||||
- Положительное число, если str больше str2.
|
- Положительное число, если str больше str2.
|
||||||
- 0, если строки равны.
|
- 0, если строки равны.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/string](https://learn.javascript.ru/string)**
|
||||||
@@ -75,4 +75,4 @@ alert( matrix[1][1] ); // 5, центральный элемент
|
|||||||
Итак, если мы всё же сравниваем массивы с помощью ==, то они никогда не будут одинаковыми, если только мы не сравним две переменные, которые ссылаются на один и тот же массив
|
Итак, если мы всё же сравниваем массивы с помощью ==, то они никогда не будут одинаковыми, если только мы не сравним две переменные, которые ссылаются на один и тот же массив
|
||||||
Вместо этого сравните их по элементам в цикле или используя методы итерации.
|
Вместо этого сравните их по элементам в цикле или используя методы итерации.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/array](https://learn.javascript.ru/array)**
|
||||||
@@ -165,3 +165,5 @@ alert( result ); // 15
|
|||||||
- arr.fill(value, start, end) – заполняет массив повторяющимися value, начиная с индекса start до end.
|
- arr.fill(value, start, end) – заполняет массив повторяющимися value, начиная с индекса start до end.
|
||||||
- arr.copyWithin(target, start, end) – копирует свои элементы, начиная с позиции start и заканчивая end, в себя, на позицию target (перезаписывая существующие).
|
- arr.copyWithin(target, start, end) – копирует свои элементы, начиная с позиции start и заканчивая end, в себя, на позицию target (перезаписывая существующие).
|
||||||
- arr.flat(depth)/arr.flatMap(fn) создаёт новый плоский массив из многомерного массива.
|
- arr.flat(depth)/arr.flatMap(fn) создаёт новый плоский массив из многомерного массива.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/array-methods](https://learn.javascript.ru/array-methods)**
|
||||||
@@ -94,4 +94,5 @@ alert(obj.orange); // готово! obj = { banana: 1, orange: 2, meat: 4 }
|
|||||||
- **`set.values()`** – возвращает перебираемый объект для значений,
|
- **`set.values()`** – возвращает перебираемый объект для значений,
|
||||||
- **`set.keys()`** – то же самое, что и **`set.values()`**, присутствует для обратной совместимости с **`Map`**,
|
- **`set.keys()`** – то же самое, что и **`set.values()`**, присутствует для обратной совместимости с **`Map`**,
|
||||||
- **`set.entries()`** – возвращает перебираемый объект для пар вида [значение, значение], присутствует для обратной совместимости с **`Map`**.
|
- **`set.entries()`** – возвращает перебираемый объект для пар вида [значение, значение], присутствует для обратной совместимости с **`Map`**.
|
||||||
-
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/map-set](https://learn.javascript.ru/map-set)**
|
||||||
@@ -61,3 +61,5 @@ alert(visitedSet.has(mary)); // false
|
|||||||
john = null;
|
john = null;
|
||||||
// структура данных visitedSet будет очищена автоматически (объект john будет удалён из visitedSet)
|
// структура данных visitedSet будет очищена автоматически (объект john будет удалён из visitedSet)
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/weakmap-weakset](https://learn.javascript.ru/weakmap-weakset)**
|
||||||
@@ -36,3 +36,5 @@ let user = {
|
|||||||
1. Вызов **`Object.entries(obj)`** возвращает массив пар ключ/значение для obj.
|
1. Вызов **`Object.entries(obj)`** возвращает массив пар ключ/значение для obj.
|
||||||
2. На нём вызываем методы массива, например, **`map`**.
|
2. На нём вызываем методы массива, например, **`map`**.
|
||||||
3. Используем `Object.fromEntries(array)` на результате, чтобы преобразовать его обратно в объект.
|
3. Используем `Object.fromEntries(array)` на результате, чтобы преобразовать его обратно в объект.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/keys-values-entries](https://learn.javascript.ru/keys-values-entries)**
|
||||||
@@ -117,3 +117,5 @@ function showMenu(title = "Untitled", width = 200, height = 100, items = []) {
|
|||||||
// ...
|
// ...
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/destructuring-assignment](https://learn.javascript.ru/destructuring-assignment)**
|
||||||
@@ -69,3 +69,5 @@ alert(date); // ...1st Feb 2013!
|
|||||||
Возможны и более короткие варианты, например, YYYY-MM-DD или YYYY-MM, или даже YYYY.
|
Возможны и более короткие варианты, например, YYYY-MM-DD или YYYY-MM, или даже YYYY.
|
||||||
|
|
||||||
Вызов Date.parse(str) обрабатывает строку в заданном формате и возвращает таймстамп (количество миллисекунд с 1 января 1970 года UTC+0). Если формат неправильный, возвращается NaN.
|
Вызов Date.parse(str) обрабатывает строку в заданном формате и возвращает таймстамп (количество миллисекунд с 1 января 1970 года UTC+0). Если формат неправильный, возвращается NaN.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/date](https://learn.javascript.ru/date)**
|
||||||
@@ -60,3 +60,4 @@ let value = JSON.parse(str[, reviver]);
|
|||||||
|
|
||||||
Кроме того, JSON не поддерживает комментарии.
|
Кроме того, JSON не поддерживает комментарии.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/json](https://learn.javascript.ru/json)**
|
||||||
@@ -43,3 +43,5 @@ let double = n => n * 2;
|
|||||||
- У функций могут быть локальные переменные: т.е. объявленные в теле функции. Такие переменные видимы только внутри функции.
|
- У функций могут быть локальные переменные: т.е. объявленные в теле функции. Такие переменные видимы только внутри функции.
|
||||||
- У параметров могут быть значения по умолчанию: function sum(a = 1, b = 2) \{...\}.
|
- У параметров могут быть значения по умолчанию: function sum(a = 1, b = 2) \{...\}.
|
||||||
- Функции всегда что-нибудь возвращают. Если нет оператора return, результатом будет undefined.
|
- Функции всегда что-нибудь возвращают. Если нет оператора return, результатом будет undefined.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/function-basics](https://learn.javascript.ru/function-basics)**
|
||||||
@@ -37,3 +37,5 @@ function имя(параметры, через, запятую) {
|
|||||||
|
|
||||||
❗ ***Результат функции с пустым return или без него – undefined*** \
|
❗ ***Результат функции с пустым return или без него – undefined*** \
|
||||||
❌ Никогда не добавляйте перевод строки между return и его значением
|
❌ Никогда не добавляйте перевод строки между return и его значением
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/function-basics](https://learn.javascript.ru/function-basics)**
|
||||||
@@ -79,3 +79,5 @@ let sayHi = function(name) { // (*) магии больше нет
|
|||||||
В большинстве случаев, когда нам нужно объявить функцию, Function Declaration предпочтительнее, т.к функция будет видна
|
В большинстве случаев, когда нам нужно объявить функцию, Function Declaration предпочтительнее, т.к функция будет видна
|
||||||
до своего объявления в коде. Это даёт нам больше гибкости в организации кода, и, как правило, делает его более
|
до своего объявления в коде. Это даёт нам больше гибкости в организации кода, и, как правило, делает его более
|
||||||
читабельным.
|
читабельным.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/function-expressions](https://learn.javascript.ru/function-expressions)**
|
||||||
@@ -58,3 +58,5 @@ function defer(f, ms) {
|
|||||||
- Не имеют arguments.
|
- Не имеют arguments.
|
||||||
- Не могут быть вызваны с new.
|
- Не могут быть вызваны с new.
|
||||||
- У них также нет super.
|
- У них также нет super.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/arrow-functions-basics](https://learn.javascript.ru/arrow-functions-basics)**
|
||||||
@@ -60,3 +60,4 @@ let arr = [3, 5, 1];
|
|||||||
alert( Math.max(...arr) ); // 5 (оператор "раскрывает" массив в список аргументов)
|
alert( Math.max(...arr) ); // 5 (оператор "раскрывает" массив в список аргументов)
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/rest-parameters-spread-operator](https://learn.javascript.ru/rest-parameters-spread-operator)**
|
||||||
@@ -3,8 +3,6 @@ sidebar_position: 6
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Область видимости переменных, замыкание
|
# Область видимости переменных, замыкание
|
||||||
Источник: DeepSeek
|
|
||||||
Доп. источник: [https://learn.javascript.ru/closure](https://learn.javascript.ru/closure)
|
|
||||||
|
|
||||||
## Область видимости (scope)
|
## Область видимости (scope)
|
||||||
В JavaScript **область видимости (scope)** определяет, где переменные, функции и другие идентификаторы могут быть использованы в коде. Понимание области видимости важно для написания корректного и предсказуемого кода. В JavaScript есть несколько типов областей видимости:
|
В JavaScript **область видимости (scope)** определяет, где переменные, функции и другие идентификаторы могут быть использованы в коде. Понимание области видимости важно для написания корректного и предсказуемого кода. В JavaScript есть несколько типов областей видимости:
|
||||||
@@ -134,3 +132,6 @@ delayedGreeting("Алексей"); // Через 1 секунду: "Привет
|
|||||||
Замыкания могут приводить к утечкам памяти, если они сохраняют ссылки на большие объекты, которые больше не используются. Чтобы избежать этого:
|
Замыкания могут приводить к утечкам памяти, если они сохраняют ссылки на большие объекты, которые больше не используются. Чтобы избежать этого:
|
||||||
- Убедитесь, что замыкания не сохраняют ненужные данные.
|
- Убедитесь, что замыкания не сохраняют ненужные данные.
|
||||||
- Используйте null для очистки ссылок, когда они больше не нужны.
|
- Используйте null для очистки ссылок, когда они больше не нужны.
|
||||||
|
|
||||||
|
🚀 Источник: DeepSeek \
|
||||||
|
🚀 Доп. источник: [https://learn.javascript.ru/closure](https://learn.javascript.ru/closure)
|
||||||
@@ -18,3 +18,5 @@ sidebar_position: 7
|
|||||||
- Следует хранить значения в глобальном объекте, только если они действительно глобальны для нашего проекта. И стараться свести их количество к минимуму.
|
- Следует хранить значения в глобальном объекте, только если они действительно глобальны для нашего проекта. И стараться свести их количество к минимуму.
|
||||||
- В браузерах, если только мы не используем модули, глобальные функции и переменные, объявленные с помощью var, становятся свойствами глобального объекта.
|
- В браузерах, если только мы не используем модули, глобальные функции и переменные, объявленные с помощью var, становятся свойствами глобального объекта.
|
||||||
- Для того, чтобы код был проще и в будущем его легче было поддерживать, следует обращаться к свойствам глобального объекта напрямую, как window.x.
|
- Для того, чтобы код был проще и в будущем его легче было поддерживать, следует обращаться к свойствам глобального объекта напрямую, как window.x.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/global-object](https://learn.javascript.ru/global-object)**
|
||||||
@@ -67,3 +67,5 @@ let timerId = setTimeout(function request() {
|
|||||||
Это планирует вызов `func` настолько быстро, насколько это возможно. Но планировщик будет вызывать функцию только после завершения выполнения текущего кода.
|
Это планирует вызов `func` настолько быстро, насколько это возможно. Но планировщик будет вызывать функцию только после завершения выполнения текущего кода.
|
||||||
|
|
||||||
Так вызов функции будет запланирован сразу после выполнения текущего кода.
|
Так вызов функции будет запланирован сразу после выполнения текущего кода.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/settimeout-setinterval](https://learn.javascript.ru/settimeout-setinterval)**
|
||||||
@@ -23,3 +23,4 @@ let wrapper = function(original, arguments) {
|
|||||||
```
|
```
|
||||||
Весьма распространено заимствовать методы массива и применять их к arguments. В качестве альтернативы можно использовать объект с остаточными параметрами ...args, который является реальным массивом.
|
Весьма распространено заимствовать методы массива и применять их к arguments. В качестве альтернативы можно использовать объект с остаточными параметрами ...args, который является реальным массивом.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/call-apply-decorators](https://learn.javascript.ru/call-apply-decorators)**
|
||||||
@@ -62,3 +62,5 @@ let sayHi = user.sayHi.bind(user); // (*)
|
|||||||
sayHi(); // Привет, Вася!
|
sayHi(); // Привет, Вася!
|
||||||
setTimeout(sayHi, 1000); // Привет, Вася!
|
setTimeout(sayHi, 1000); // Привет, Вася!
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/bind](https://learn.javascript.ru/bind)**
|
||||||
@@ -42,3 +42,5 @@ sidebar_position: 1
|
|||||||
Цикл `for..in` проходит не только по собственным, но и по унаследованным свойствам объекта.
|
Цикл `for..in` проходит не только по собственным, но и по унаследованным свойствам объекта.
|
||||||
|
|
||||||
Если унаследованные свойства нам не нужны, то мы можем отфильтровать их при помощи встроенного метода `obj.hasOwnProperty(key)`: он возвращает `true`, если у `obj` есть собственное, не унаследованное, свойство с именем `key`.
|
Если унаследованные свойства нам не нужны, то мы можем отфильтровать их при помощи встроенного метода `obj.hasOwnProperty(key)`: он возвращает `true`, если у `obj` есть собственное, не унаследованное, свойство с именем `key`.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/prototype-inheritance](https://learn.javascript.ru/prototype-inheritance)**
|
||||||
@@ -26,3 +26,5 @@ let user = {
|
|||||||
```
|
```
|
||||||
|
|
||||||
По умолчанию все функции имеют `F.prototype = { constructor: F }`, поэтому мы можем получить конструктор объекта через свойство `"constructor"`.
|
По умолчанию все функции имеют `F.prototype = { constructor: F }`, поэтому мы можем получить конструктор объекта через свойство `"constructor"`.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/function-prototype](https://learn.javascript.ru/function-prototype)**
|
||||||
@@ -64,3 +64,5 @@ alert( obj.join(',') ); // Hello,world!
|
|||||||
Но это будет невозможно, если `obj` уже наследует от другого объекта. Помните, мы можем наследовать только от одного объекта одновременно.
|
Но это будет невозможно, если `obj` уже наследует от другого объекта. Помните, мы можем наследовать только от одного объекта одновременно.
|
||||||
|
|
||||||
Заимствование методов – гибкий способ, позволяющий смешивать функциональность разных объектов по необходимости.
|
Заимствование методов – гибкий способ, позволяющий смешивать функциональность разных объектов по необходимости.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/native-prototypes](https://learn.javascript.ru/native-prototypes)**
|
||||||
@@ -29,3 +29,5 @@ sidebar_position: 4
|
|||||||
- `obj.hasOwnProperty(key)`: возвращает `true`, если у `obj` есть собственное (не унаследованное) свойство с именем `key`.
|
- `obj.hasOwnProperty(key)`: возвращает `true`, если у `obj` есть собственное (не унаследованное) свойство с именем `key`.
|
||||||
|
|
||||||
Все методы, которые возвращают свойства объектов (такие как `Object.keys` и другие), возвращают «собственные» свойства. Если мы хотим получить и унаследованные, можно воспользоваться циклом `for..in`.
|
Все методы, которые возвращают свойства объектов (такие как `Object.keys` и другие), возвращают «собственные» свойства. Если мы хотим получить и унаследованные, можно воспользоваться циклом `for..in`.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/prototype-methods](https://learn.javascript.ru/prototype-methods)**
|
||||||
@@ -49,3 +49,5 @@ class User {
|
|||||||
new User().sayHi();
|
new User().sayHi();
|
||||||
```
|
```
|
||||||
Свойство name не устанавливается в `User.prototype`. Вместо этого оно создаётся оператором `new` перед запуском конструктора, это именно свойство объекта.
|
Свойство name не устанавливается в `User.prototype`. Вместо этого оно создаётся оператором `new` перед запуском конструктора, это именно свойство объекта.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/class](https://learn.javascript.ru/class)**
|
||||||
@@ -46,3 +46,5 @@ class Rabbit extends Animal {
|
|||||||
|
|
||||||
super.method(...) вызывает родительский метод.
|
super.method(...) вызывает родительский метод.
|
||||||
super(...) для вызова родительского конструктора (работает только внутри нашего конструктора).
|
super(...) для вызова родительского конструктора (работает только внутри нашего конструктора).
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/class-inheritance](https://learn.javascript.ru/class-inheritance)**
|
||||||
@@ -44,3 +44,5 @@ Article.publisher = "Илья Кантор";
|
|||||||
|
|
||||||
## Наследование статических свойств и методов
|
## Наследование статических свойств и методов
|
||||||
Статические свойства и методы наследуются.
|
Статические свойства и методы наследуются.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/static-properties-methods](https://learn.javascript.ru/static-properties-methods)**
|
||||||
@@ -44,3 +44,5 @@ sidebar_position: 4
|
|||||||
На уровне языка # является специальным символом, который означает, что поле приватное. Мы не можем получить к нему доступ извне или из наследуемых классов.
|
На уровне языка # является специальным символом, который означает, что поле приватное. Мы не можем получить к нему доступ извне или из наследуемых классов.
|
||||||
|
|
||||||
Приватные поля не конфликтуют с публичными. У нас может быть два поля одновременно – приватное #waterAmount и публичное waterAmount.
|
Приватные поля не конфликтуют с публичными. У нас может быть два поля одновременно – приватное #waterAmount и публичное waterAmount.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/private-protected-properties-methods](https://learn.javascript.ru/private-protected-properties-methods)**
|
||||||
@@ -44,3 +44,5 @@ alert( {}.toString.call(new XMLHttpRequest()) ); // [object XMLHttpRequest]
|
|||||||
В итоге мы получили «typeof на стероидах», который не только работает с примитивными типами данных, но также и со встроенными объектами, и даже может быть настроен.
|
В итоге мы получили «typeof на стероидах», который не только работает с примитивными типами данных, но также и со встроенными объектами, и даже может быть настроен.
|
||||||
|
|
||||||
Можно использовать `{}.toString.call` вместо `instanceof` для встроенных объектов, когда мы хотим получить тип в виде строки, а не просто сделать проверку.
|
Можно использовать `{}.toString.call` вместо `instanceof` для встроенных объектов, когда мы хотим получить тип в виде строки, а не просто сделать проверку.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/instanceof](https://learn.javascript.ru/instanceof)**
|
||||||
@@ -13,3 +13,5 @@ sidebar_position: 6
|
|||||||
Простейший способ реализовать примесь в JavaScript – это создать объект с полезными методами, которые затем могут быть легко добавлены в прототип любого класса.\
|
Простейший способ реализовать примесь в JavaScript – это создать объект с полезными методами, которые затем могут быть легко добавлены в прототип любого класса.\
|
||||||
Это не наследование, а просто копирование методов.
|
Это не наследование, а просто копирование методов.
|
||||||
Примеси могут наследовать друг друга.
|
Примеси могут наследовать друг друга.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/mixins](https://learn.javascript.ru/mixins)**
|
||||||
@@ -72,3 +72,5 @@ window.onerror = function(message, url, line, col, error) {
|
|||||||
- **url** - URL скрипта, в котором произошла ошибка.
|
- **url** - URL скрипта, в котором произошла ошибка.
|
||||||
- **line**, col - Номера строки и столбца, в которых произошла ошибка.
|
- **line**, col - Номера строки и столбца, в которых произошла ошибка.
|
||||||
- **error** - Объект ошибки.
|
- **error** - Объект ошибки.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/try-catch](https://learn.javascript.ru/try-catch)**
|
||||||
@@ -3,9 +3,9 @@ sidebar_position: 2
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Пользовательские ошибки, расширение Error
|
# Пользовательские ошибки, расширение Error
|
||||||
Источник: [https://learn.javascript.ru/custom-errors](https://learn.javascript.ru/custom-errors)
|
|
||||||
|
|
||||||
- Мы можем наследовать свои классы ошибок от `Error` и других встроенных классов ошибок, но нужно позаботиться о свойстве name и не забыть вызвать `super`.
|
- Мы можем наследовать свои классы ошибок от `Error` и других встроенных классов ошибок, но нужно позаботиться о свойстве name и не забыть вызвать `super`.
|
||||||
- Мы можем использовать `instanceof` для проверки типа ошибок. Это также работает с наследованием. Но иногда у нас объект ошибки, возникшей в сторонней библиотеке, и нет простого способа получить класс. Тогда для проверки типа ошибки можно использовать свойство `name`.
|
- Мы можем использовать `instanceof` для проверки типа ошибок. Это также работает с наследованием. Но иногда у нас объект ошибки, возникшей в сторонней библиотеке, и нет простого способа получить класс. Тогда для проверки типа ошибки можно использовать свойство `name`.
|
||||||
- Обёртывание исключений является распространённой техникой: функция ловит низкоуровневые исключения и создаёт одно «высокоуровневое» исключение вместо разных низкоуровневых. Иногда низкоуровневые исключения становятся свойствами этого объекта, как `err.cause` в примерах выше, но это не обязательно.
|
- Обёртывание исключений является распространённой техникой: функция ловит низкоуровневые исключения и создаёт одно «высокоуровневое» исключение вместо разных низкоуровневых. Иногда низкоуровневые исключения становятся свойствами этого объекта, как `err.cause` в примерах выше, но это не обязательно.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/custom-errors](https://learn.javascript.ru/custom-errors)**
|
||||||
@@ -3,7 +3,6 @@ sidebar_position: 1
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Введение: колбэки
|
# Введение: колбэки
|
||||||
Источник *Deepseek*
|
|
||||||
|
|
||||||
Асинхронное программирование с использованием callback-функций в JavaScript — это один из традиционных подходов для работы с асинхронными операциями, такими как чтение файлов, запросы к серверу или таймеры. Callback-функция передается в качестве аргумента в асинхронную функцию и вызывается после завершения этой операции.
|
Асинхронное программирование с использованием callback-функций в JavaScript — это один из традиционных подходов для работы с асинхронными операциями, такими как чтение файлов, запросы к серверу или таймеры. Callback-функция передается в качестве аргумента в асинхронную функцию и вызывается после завершения этой операции.
|
||||||
|
|
||||||
@@ -44,3 +43,5 @@ console.log("Ожидание данных...");
|
|||||||
Особенности:
|
Особенности:
|
||||||
- Callback-функции могут привести к так называемому "callback hell" (ад колбэков), когда много асинхронных операций вложены друг в друга, что делает код сложным для чтения и поддержки.
|
- Callback-функции могут привести к так называемому "callback hell" (ад колбэков), когда много асинхронных операций вложены друг в друга, что делает код сложным для чтения и поддержки.
|
||||||
- В современных JavaScript-проектах вместо callback-функций часто используют Promises или async/await для более удобной работы с асинхронным кодом.
|
- В современных JavaScript-проектах вместо callback-функций часто используют Promises или async/await для более удобной работы с асинхронным кодом.
|
||||||
|
|
||||||
|
🚀 **Источник Deepseek**
|
||||||
@@ -3,8 +3,6 @@ sidebar_position: 2
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Promises
|
# Promises
|
||||||
Источник *Deepseek*
|
|
||||||
|
|
||||||
Использование Promises (обещаний) в JavaScript — это более современный и удобный способ работы с асинхронными операциями по сравнению с callback-функциями. Promises позволяют избежать "callback hell" и делают код более читаемым и структурированным.
|
Использование Promises (обещаний) в JavaScript — это более современный и удобный способ работы с асинхронными операциями по сравнению с callback-функциями. Promises позволяют избежать "callback hell" и делают код более читаемым и структурированным.
|
||||||
|
|
||||||
Вот пример асинхронного программирования с использованием Promises:
|
Вот пример асинхронного программирования с использованием Promises:
|
||||||
@@ -83,3 +81,5 @@ fetchData()
|
|||||||
|
|
||||||
💥 **Thenable**
|
💥 **Thenable**
|
||||||
> Если быть более точными, обработчик может возвращать не именно промис, а любой объект, содержащий метод .then, такие объекты называют «thenable», и этот объект будет обработан как промис.
|
> Если быть более точными, обработчик может возвращать не именно промис, а любой объект, содержащий метод .then, такие объекты называют «thenable», и этот объект будет обработан как промис.
|
||||||
|
|
||||||
|
🚀 **Источник Deepseek**
|
||||||
@@ -3,8 +3,6 @@ sidebar_position: 3
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Обработка ошибок
|
# Обработка ошибок
|
||||||
Источник: [https://learn.javascript.ru/promise-error-handling](https://learn.javascript.ru/promise-error-handling)
|
|
||||||
|
|
||||||
- `.catch` перехватывает все виды ошибок в промисах: будь то вызов `reject()` или ошибка, брошенная в обработчике при помощи `throw`.
|
- `.catch` перехватывает все виды ошибок в промисах: будь то вызов `reject()` или ошибка, брошенная в обработчике при помощи `throw`.
|
||||||
- `.then` также перехватывает ошибки таким же образом, если задан второй аргумент (который является обработчиком ошибок).
|
- `.then` также перехватывает ошибки таким же образом, если задан второй аргумент (который является обработчиком ошибок).
|
||||||
- Необходимо размещать `.catch` там, где мы хотим обработать ошибки и знаем, как это сделать. Обработчик может проанализировать ошибку (могут быть полезны пользовательские классы ошибок) и пробросить её, если ничего не знает о ней (возможно, это программная ошибка).
|
- Необходимо размещать `.catch` там, где мы хотим обработать ошибки и знаем, как это сделать. Обработчик может проанализировать ошибку (могут быть полезны пользовательские классы ошибок) и пробросить её, если ничего не знает о ней (возможно, это программная ошибка).
|
||||||
@@ -50,3 +48,4 @@ new Promise(function() {
|
|||||||
|
|
||||||
Обычно такие ошибки неустранимы, поэтому лучше всего – информировать пользователя о проблеме и, возможно, отправить информацию об ошибке на сервер.
|
Обычно такие ошибки неустранимы, поэтому лучше всего – информировать пользователя о проблеме и, возможно, отправить информацию об ошибке на сервер.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/promise-error-handling](https://learn.javascript.ru/promise-error-handling)**
|
||||||
@@ -3,7 +3,6 @@ sidebar_position: 4
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Promise API
|
# Promise API
|
||||||
Источник:
|
|
||||||
В классе Promise есть 6 статических методов.
|
В классе Promise есть 6 статических методов.
|
||||||
|
|
||||||
- **Promise.all(promises)** – ожидает выполнения всех промисов и возвращает массив с результатами. Если любой из указанных промисов вернёт ошибку, то результатом работы Promise.all будет эта ошибка, результаты остальных промисов будут игнорироваться.
|
- **Promise.all(promises)** – ожидает выполнения всех промисов и возвращает массив с результатами. Если любой из указанных промисов вернёт ошибку, то результатом работы Promise.all будет эта ошибка, результаты остальных промисов будут игнорироваться.
|
||||||
@@ -16,3 +15,5 @@ sidebar_position: 4
|
|||||||
- **Promise.reject(error)** – возвращает промис с ошибкой error.
|
- **Promise.reject(error)** – возвращает промис с ошибкой error.
|
||||||
|
|
||||||
Из всех перечисленных методов, самый часто используемый – **Promise.all**.
|
Из всех перечисленных методов, самый часто используемый – **Promise.all**.
|
||||||
|
|
||||||
|
🚀 **Источник Deepseek**
|
||||||
@@ -3,8 +3,6 @@ sidebar_position: 5
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Промисификация
|
# Промисификация
|
||||||
Источник: [https://learn.javascript.ru/promisify](https://learn.javascript.ru/promisify)
|
|
||||||
|
|
||||||
Промисификация – это длинное слово для простого преобразования. Мы берём функцию, которая принимает колбэк и меняем её, чтобы она вместо этого возвращала промис.
|
Промисификация – это длинное слово для простого преобразования. Мы берём функцию, которая принимает колбэк и меняем её, чтобы она вместо этого возвращала промис.
|
||||||
|
|
||||||
Такие преобразования часто необходимы в реальной жизни, так как многие функции и библиотеки основаны на колбэках, а использование промисов более удобно, поэтому есть смысл «промисифицировать» их.
|
Такие преобразования часто необходимы в реальной жизни, так как многие функции и библиотеки основаны на колбэках, а использование промисов более удобно, поэтому есть смысл «промисифицировать» их.
|
||||||
@@ -39,3 +37,5 @@ function promisify(f, manyArgs = false) {
|
|||||||
f = promisify(f, true);
|
f = promisify(f, true);
|
||||||
f(...).then(arrayOfResults => ..., err => ...)
|
f(...).then(arrayOfResults => ..., err => ...)
|
||||||
```
|
```
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/promisify](https://learn.javascript.ru/promisify)**
|
||||||
@@ -17,3 +17,5 @@ sidebar_position: 6
|
|||||||
Вместе они предоставляют отличный каркас для написания асинхронного кода. Такой код легко и писать, и читать.
|
Вместе они предоставляют отличный каркас для написания асинхронного кода. Такой код легко и писать, и читать.
|
||||||
|
|
||||||
Хотя при работе с `async/await` можно обходиться без `promise.then/catch`, иногда всё-таки приходится использовать эти методы (на верхнем уровне вложенности, например). Также `await` отлично работает в сочетании с `Promise.all`, если необходимо выполнить несколько задач параллельно.
|
Хотя при работе с `async/await` можно обходиться без `promise.then/catch`, иногда всё-таки приходится использовать эти методы (на верхнем уровне вложенности, например). Также `await` отлично работает в сочетании с `Promise.all`, если необходимо выполнить несколько задач параллельно.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/async-await](https://learn.javascript.ru/async-await)**
|
||||||
@@ -3,9 +3,6 @@ sidebar_position: 7
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Event loop
|
# Event loop
|
||||||
Источник: DeepSeek \
|
|
||||||
Видеоразбор: [JavaScript - Event Loop | Асинхронность, Web API, Очереди (макро/микро)задач, Отрисовка кадров](https://www.youtube.com/watch?v=YTLXrji4DJc)
|
|
||||||
|
|
||||||
Event Loop (цикл событий) — это механизм, который позволяет JavaScript выполнять асинхронные операции, несмотря на то, что сам язык является однопоточным. Он отвечает за обработку событий, вызовов колбэков и выполнение задач в правильном порядке.
|
Event Loop (цикл событий) — это механизм, который позволяет JavaScript выполнять асинхронные операции, несмотря на то, что сам язык является однопоточным. Он отвечает за обработку событий, вызовов колбэков и выполнение задач в правильном порядке.
|
||||||
|
|
||||||
## Основные компоненты Event Loop
|
## Основные компоненты Event Loop
|
||||||
@@ -66,3 +63,6 @@ Timeout
|
|||||||
4. После завершения синхронного кода Event Loop сначала выполняет микрозадачи (колбэк промиса), а затем переходит к Callback Queue (колбэк `setTimeout`).
|
4. После завершения синхронного кода Event Loop сначала выполняет микрозадачи (колбэк промиса), а затем переходит к Callback Queue (колбэк `setTimeout`).
|
||||||
|
|
||||||
Event Loop позволяет JavaScript эффективно обрабатывать асинхронные операции, несмотря на однопоточность. Он управляет порядком выполнения задач, используя Call Stack, Web APIs, Callback Queue и Microtask Queue. Понимание этого механизма важно для написания эффективного и предсказуемого асинхронного кода.
|
Event Loop позволяет JavaScript эффективно обрабатывать асинхронные операции, несмотря на однопоточность. Он управляет порядком выполнения задач, используя Call Stack, Web APIs, Callback Queue и Microtask Queue. Понимание этого механизма важно для написания эффективного и предсказуемого асинхронного кода.
|
||||||
|
|
||||||
|
🚀 **Источник: DeepSeek** \
|
||||||
|
🚀 Видеоразбор: [JavaScript - Event Loop | Асинхронность, Web API, Очереди (макро/микро)задач, Отрисовка кадров](https://www.youtube.com/watch?v=YTLXrji4DJc)
|
||||||
|
|||||||
@@ -60,3 +60,5 @@ for(let value of generator) {
|
|||||||
`yield` – дорога в обе стороны: он не только возвращает результат наружу, но и может передавать значение извне в генератор.
|
`yield` – дорога в обе стороны: он не только возвращает результат наружу, но и может передавать значение извне в генератор.
|
||||||
|
|
||||||
Чтобы это сделать, нам нужно вызвать `generator.next(arg)` с аргументом. Этот аргумент становится результатом `yield`.
|
Чтобы это сделать, нам нужно вызвать `generator.next(arg)` с аргументом. Этот аргумент становится результатом `yield`.
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/generators](https://learn.javascript.ru/generators)**
|
||||||
@@ -3,9 +3,6 @@ sidebar_position: 2
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Асинхронные итераторы и генераторы
|
# Асинхронные итераторы и генераторы
|
||||||
|
|
||||||
Источник: [https://learn.javascript.ru/async-iterators-generators](https://learn.javascript.ru/async-iterators-generators)
|
|
||||||
|
|
||||||
Обычные итераторы и генераторы прекрасно работают с данными, которые не требуют времени для их создания или получения.
|
Обычные итераторы и генераторы прекрасно работают с данными, которые не требуют времени для их создания или получения.
|
||||||
|
|
||||||
Когда мы ожидаем, что данные будут поступать асинхронно, с задержками, можно использовать их асинхронные аналоги и
|
Когда мы ожидаем, что данные будут поступать асинхронно, с задержками, можно использовать их асинхронные аналоги и
|
||||||
@@ -32,3 +29,5 @@ sidebar_position: 2
|
|||||||
например, браузерах, есть и другое API, называемое Streams (потоки), который предоставляет специальные интерфейсы для
|
например, браузерах, есть и другое API, называемое Streams (потоки), который предоставляет специальные интерфейсы для
|
||||||
работы с такими потоками данных, их преобразования и передачи из одного потока в другой (например, загрузка из одного
|
работы с такими потоками данных, их преобразования и передачи из одного потока в другой (например, загрузка из одного
|
||||||
источника и сразу отправка в другое место).
|
источника и сразу отправка в другое место).
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/async-iterators-generators](https://learn.javascript.ru/async-iterators-generators)**
|
||||||
@@ -36,4 +36,5 @@ sidebar_position: 1
|
|||||||
- Если один и тот же модуль используется в нескольких местах, то его код выполнится только один раз, после чего экспортируемая функциональность передаётся всем импортёрам.
|
- Если один и тот же модуль используется в нескольких местах, то его код выполнится только один раз, после чего экспортируемая функциональность передаётся всем импортёрам.
|
||||||
- Объект import.meta содержит информацию о текущем модуле. Содержимое зависит от окружения.
|
- Объект import.meta содержит информацию о текущем модуле. Содержимое зависит от окружения.
|
||||||
- В модуле на верхнем уровне this не определён (undefined).
|
- В модуле на верхнем уровне this не определён (undefined).
|
||||||
-
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/modules-intro](https://learn.javascript.ru/modules-intro)**
|
||||||
@@ -3,8 +3,6 @@ sidebar_position: 2
|
|||||||
---
|
---
|
||||||
|
|
||||||
# Экспорт и импорт
|
# Экспорт и импорт
|
||||||
Источник: [https://learn.javascript.ru/import-export](https://learn.javascript.ru/import-export)
|
|
||||||
|
|
||||||
Вот все варианты export, которые мы разобрали в этой и предыдущей главах.
|
Вот все варианты export, которые мы разобрали в этой и предыдущей главах.
|
||||||
|
|
||||||
Вы можете проверить себя, читая их и вспоминая, что они означают:
|
Вы можете проверить себя, читая их и вспоминая, что они означают:
|
||||||
@@ -32,3 +30,5 @@ sidebar_position: 2
|
|||||||
Мы можем поставить import/export в начало или в конец скрипта, это не имеет значения.
|
Мы можем поставить import/export в начало или в конец скрипта, это не имеет значения.
|
||||||
|
|
||||||
💥 **Обратите внимание, что инструкции import/export не работают внутри `{...}`.**
|
💥 **Обратите внимание, что инструкции import/export не работают внутри `{...}`.**
|
||||||
|
|
||||||
|
🚀 **Источник: [https://learn.javascript.ru/import-export](https://learn.javascript.ru/import-export)**
|
||||||
Reference in New Issue
Block a user