From 08e557da92082f137c2440daf6e08dc45ab8b45b Mon Sep 17 00:00:00 2001 From: roma-dxunvrs Date: Sun, 20 Sep 2026 13:12:31 +0300 Subject: [PATCH] Add js --- Веб/Фронтенд/ECMAScript.md | 185 +++++++++++++++++++++++++++++-------- Итмо/Предметы/Теорвер.md | 5 +- 2 files changed, 150 insertions(+), 40 deletions(-) diff --git a/Веб/Фронтенд/ECMAScript.md b/Веб/Фронтенд/ECMAScript.md index d47f093..475d182 100644 --- a/Веб/Фронтенд/ECMAScript.md +++ b/Веб/Фронтенд/ECMAScript.md @@ -3,6 +3,36 @@ - Объектный тип данных - Object - 15 различных видов инструкций > [!warning] Дальнейшие примеры будут до стандарта ES6, то есть не совсем актуальные, использование `var` - моветон в наше время. Также после 2020 года уже 7 примитивов - еще Symbol и BigInt +- [[#Особенности языка|Особенности языка]] +- [[#ES6|ES6]] +- [[#let и const|let и const]] +- [[#Форматирование вывода|Форматирование вывода]] +- [[#Деструктуризация|Деструктуризация]] +- [[#Классы и объекты|Классы и объекты]] +- [[#Наследование|Наследование]] +- [[#Типы данных|Типы данных]] + - [[#`Number`|`Number`]] + - [[#`String`|`String`]] + - [[#`Boolean`|`Boolean`]] + - [[#`Undefined`|`Undefined`]] + - [[#`Null`|`Null`]] + - [[#`Symbol`|`Symbol`]] + - [[#`Object`|`Object`]] +- [[#Приведение типов|Приведение типов]] + - [[#Строгое равенство `===`|Строгое равенство `===`]] + - [[#Нестрогое равенство `==`|Нестрогое равенство `==`]] + - [[#Нестрогое равенство `==`#Правила кастов|Правила кастов]] +- [[#Стрелочные функции|Стрелочные функции]] +- [[#Цикл с итератором|Цикл с итератором]] +- [[#Параметры по умолчанию|Параметры по умолчанию]] +- [[#Rest-параметры|Rest-параметры]] + - [[#Rest-параметры#Операция spread|Операция spread]] +- [[#Promise|Promise]] + - [[#Операция spread#Состояния промиса|Состояния промиса]] + - [[#Операция spread#Работа с промисом|Работа с промисом]] + - [[#Операция spread#Async и Await|Async и Await]] +- [[#Event Loop и Асинхронность|Event Loop и Асинхронность]] + - [[#Операция spread#Приоритет выполнения задач|Приоритет выполнения задач]] ## Особенности языка - Блок не ограничивает область видимости переменной: ```JavaScript @@ -41,7 +71,7 @@ var sum3 = new Function("a", "b", "return a+b;"); // без комментари ``` ## ES6 - Новая версия, выпущенная в 2015 году -- Добавляет синтаксис +- Добавляет новый синтаксис > [!warning] Дальше примеры для ES6 и новее ## let и const Два новых ключевых слова @@ -114,6 +144,95 @@ lion.speak(); // Simba makes a noise. // Simba roars. ``` +## Типы данных +#### `Number` +- Любое число под капотом это 64-битное число с плавающей точкой (как `double` в джаве). +- `Infinity / -Infinity` (например при делении на 0) +- `NaN` (например при делении строки на число) +- Опасность сравнения `0.1 + 0.2 === 0.3 // false` +#### `String` +- В `UTF-16` +- Нет разницы между одинарными и двойными кавычками +#### `Boolean` +- `true` / `false` +#### `Undefined` +- `undefined` +- Техническое значение по умолчанию +- Присваивает сам движок +#### `Null` +- `null` +- Намеренное отсутствие значения +#### `Symbol` +- Уникальный и неизменяемый идентификатор +- `Symbol("id") === Symbol("id") // false` +- Нужен для создания скрытых свойств внутри объектов, которые нельзя случайно перезаписать или увидеть при обычном переборе через `for...in` +#### `Object` +- Все, что не примитив +- Например словари `{}` - аналог `HashMap` джавы +- Массивы, функции, даты, регулярки - все это `Object` +## Приведение типов +Существует два оператора равенства: `==` и `===` +#### Строгое равенство `===` +- Проверяет и тип, и значение +- Никаких скрытых преобразований +```JavaScript +5 === 5 // true +5 === "5" // false +0 === "false" // false +null === undefined // false +``` +#### Нестрогое равенство `==` +- Оператор с неявным приведением типов. Если типы разные, движок пытается привести их к одному (чаще всего к числу) по алгоритму +##### Правила кастов +1. Каста `null` и `undefined` - они равны друг другу, но больше не равны ничему в языке +```JavaScript +null == undefined // true +null == 0 // false +``` +2. Булеан -> Число (в 0 или 1) +3. Строка -> Число (`"5" -> 5`, `"" -> 0`, `"hello" -> NaN`) +4. Объект -> Примитив (через метод `.toString`) +## Стрелочные функции +```JavaScript +$('.btn').click((event) => this.sendData()); +``` +## Цикл с итератором +```JavaScript +var array = ['a', 'b']; +for (var i = 0; i < array.length; i++) { + var el = array[i]; + console.log(el); +} +array.forEach(function (el) { + console.log(el) +}); +array.forEach((el) => console.log(el)); +for (const el of array) { + console.log(el); +} +``` +## Параметры по умолчанию +```JavaScript +function point(x=0, y=-1, isFlag=true) { + ... +} +``` +## Rest-параметры +Типо `vararg` в джаве +```JavaScript +function printf(format, ...params) { + ... +} +``` +### Операция spread +```JavaScript +Math.max(...[2,100,1,6,43]); + +const array1 = [1,2,3]; +const array2 = ['a', 'b']; +const array3 = [false, true]; +console.log([...array1, ...array2, ...array3]) +``` ## Promise Это специальный объект, который представляет собой результат асинхронной операции JavaScript - однопоточный, используется Event Loop в одном потоке @@ -166,44 +285,32 @@ printAfterTimeout('Hello', 2e3) }); ``` > [!hint] В новый промис передается две функции `resolve` - при успехе и `reject` - при ошибке -## Стрелочные функции +#### Async и Await +Появились в `ES8` (2017 год). Способ писать асинхронный код так, чтобы он читался как синхронный +Замена цепочкам `.then().catch()` +- `async` пишется перед объявлением функции. Такая функция автоматически оборачивает то, что возвращает, в `Promise` +- Ключевое слово `await` заставляет функцию поставить выполнение на паузу и дождаться результата +- `await` можено использовать только внутри `async` функций ```JavaScript -$('.btn').click((event) => this.sendData()); -``` -## Цикл с итератором -```JavaScript -var array = ['a', 'b']; -for (var i = 0; i < array.length; i++) { - var el = array[i]; - console.log(el); -} -array.forEach(function (el) { - console.log(el) -}); -array.forEach((el) => console.log(el)); -for (const el of array) { - console.log(el); +async function loadUser() { + try { + const response = await fetch("https://api.com/..."); + const user = await response.json(); + console.log(user); + } catch (error) { + console.error(error) + } } ``` -## Параметры по умолчанию -```JavaScript -function point(x=0, y=-1, isFlag=true) { - ... -} -``` -## Rest-параметры -Типо `vararg` в джаве -```JavaScript -function printf(format, ...params) { - ... -} -``` -### Операция spread -```JavaScript -Math.max(...[2,100,1,6,43]); - -const array1 = [1,2,3]; -const array2 = ['a', 'b']; -const array3 = [false, true]; -console.log([...array1, ...array2, ...array3]) -``` \ No newline at end of file +## Event Loop и Асинхронность +JavaScript в браузере (и Node.js) — **строго однопоточный язык**. У него есть только один **Call Stack (Стек вызовов)**, который может выполнять только одну операцию одновременно. Чтобы не блокировать поток тяжелыми задачами (запросы в сеть, таймеры), JS использует механизм **Event Loop (Цикл событий)** и делегирует работу фоновым C++ потокам браузера (Web APIs). +#### Приоритет выполнения задач +Движок JS распределяет код и колбэки по трем уровням приоритета: +1. **Стек вызовов (Call Stack) — Абсолютный приоритет** + Весь текущий синхронный код (циклы `for`, обычные функции, `console.log`). Действует правило *Run-to-completion*: пока стек не опустеет полностью, никакие асинхронные задачи из очередей не начнут выполняться, даже если они уже готовы. Блокировка стека (например, `while(true)`) намертво вешает весь браузер. +2. **VIP-очередь (Микротаски / Microtasks) — Высокий приоритет** + Сюда попадают колбэки от **Промисов** (`.then()`, `catch()`, код после `await`) и `MutationObserver`. Как только Стек пустеет, Event Loop берет микротаски и выполняет их **все до единой**, пока эта очередь не станет абсолютно пустой. +3. **Обычная очередь (Макротаски / Macrotasks) — Низкий приоритет** + Сюда попадают **Таймеры** (`setTimeout`, `setInterval`) и **события пользователя** (клики `click`, ввод с клавиатуры). Из этой очереди Event Loop берет строго **по ОДНОЙ** задаче за один цикл. Выполнив одну макрозадачу, он снова бежит проверять, не появились ли новые микротаски (Промисы), и только потом берет следующую макрозадачу. +> [!hint] Кратко: порядок выполнения + > **Синхронный СТЕК $\to$ ВСЕ Микротаски (Промисы) $\to$ ОДНА Макротаска (Таймеры) $\to$ повтор цикла.** \ No newline at end of file diff --git a/Итмо/Предметы/Теорвер.md b/Итмо/Предметы/Теорвер.md index 35a80a5..d791039 100644 --- a/Итмо/Предметы/Теорвер.md +++ b/Итмо/Предметы/Теорвер.md @@ -1,3 +1,6 @@ Кудашов ## Баллы -Хз, ходишь на все - зачет \ No newline at end of file +Хз, ходишь на все - зачет + +Какая-то [репа](https://github.com/sub-myitmo/gdz-chistyakov-teorver) с дз +Задачи на практике с [отсюда](https://yangiasr.uz/files/books/2024-02-08-11-41-22_1f24ba414e9b177d64616bb8086d1c82.pdf) \ No newline at end of file