Владилен, очень хорошо понимается материал благодаря твоим видео! Однозначно лучший контент. Если это возможно рассмотри систематизацию своих видео с дополнительными задачами по материалу. Уверен будет вообще пушечно
Это лучший материал по JS на русскоязычном youtube. Отдельно хотелось бы поблагодарить Вас Владилен за курс по Vue. Он превосходен. Он помог мне довольно быстро вникнуть во Vue. Посоветовал его одному коллеге верстальщику, он также остался им очень доволен. Спасибо Вам огромное! :)))
Владилен вы не поверите: но во время создания промиса вместо setTimeout(()=>r(),ms) можно просто записать setTimeout(r,ms); r - это есть resolve, и мы передаём ссылку на функцию в качестве колбека
Твои уроки раскрывают суть каждой концепции. Ты описываешь проблему и механизм в языке, который эту проблему решает. Информация так усваивается намного лучше. В других уроках описывают некоторые факты о части языка и не говорят как это использовать и новичок не понимает как он это может применить. Спасибо большое за труд
Согласен, у других смотрел так и не понял что такое promise, async and await, методы массивов, которые новые map и тд, а тут все сразу стало понятно, и операторы rest и spread туда же, столько полезных вещей которыми я раньше не пользовался, жаль конечно))
Самое главное, что смотря на async await может показаться, что мы только ждём код и всё. НО, как и then, await не блокирует код, а просто откладывает выполнение действующей функции (или call stack если смотреть глобальнее) и продолжит выполнять код дальше Такой код выведет 3 1 4 2. Если уже поставить await верхнего уровня перед вызовом функции, то уже будет 3 1 2 4, так как мы уже дожидаемся этой функции и по сути смысла в асинхронности тогда нет. Код внутри промиса выполняется синхронно, поэтому туда реально нужно ложить то, чего вы хотите подождать типа запроса или того же setTimeout ```JavaScript async function f() { console.log("1") let promise = new Promise((resolve, reject) => { setTimeout(() => resolve("готово!"), 1000) }); let result = await promise; // будет ждать, пока промис не выполнится (*) console.log("2") alert(result); // "готово!" } console.log("3") f(); console.log("4") ```
Спасибо! Переписывал store для авторизации из урока по Vue CRM, там была готовая библиотека firebase, а мне надо было через API реализовывать. Это видео очень выручило!
попробовал заменить в своем микропроекте .then на async/await и получилось даже еще более громоздко, может чуть читается легче, так и мне никто не мешает .then переносить на новую строку.
async/await это синтаксический сахар на генератор/промис, где генератор используется для превращения асинхронного кода в синхронный, а промис для выполнения асинхронного кода. То есть тут суть в генераторе, а промис деталь реализации генератора. Промис можно заменить на простой обратный вызов (callback).
я помню когда делал все через then только, понимал что это крутая штука что позволяет дождатся асинхронной функции, словить результат и далее его обрабатывать. ну как асинк и авейт. про промисы вобще не шарил думал промис = асинхронному методу. типа так называют в яваскрипте просто так ХД)
Пишу из 2021, вроде посмотрел внимательно урок по Promise и первый пример функции меня "убил наповал". Полез разбираться, что чего и как и в итоге, что получилось, для тех кто так же не понял как я: const delay = (ms) => new Promise((r) => setTimeout(r, ms)); Во первых это короче и даже понятнее. Итак что у нас происходит, пишу как все еще ученик: присваиваем переменной ссылку на безымянную стрелочную функцию с параметром ms она в свою очередь возвращает Promise, который возвращает по исполнении функцию setTimeout через ms миллисекунд.
Так же хорошая идея на счёт парсера на node js , на Ютубе нормальных видео нет вообще, а в статьях говорят только как спарсить в самой ноде а как это уже на свою html страницу вывести нет. Тут как раз и fetch будет нужен, потому что нужно будет как то делать запрос на сервер что бы получить эти данные
@@VladilenMinin ну если допустим есть парсер на ноде и он выводит текст только в терминале, то что бы его переместить себе в html нужно поднять сервер и сделать к нему запрос(тем же fetch) ,так ведь? Нода же не имеет доступ к дому, поэтому только так. И вот такого описания парсера с нуля и до момента вывода себе в html нету вообще нигде, ни в одном русском источнике
10:15 зачем писать await repsonse.json() если мы уже ждем fetch который запишет результат в переменную response после того как отработает, по идее await для repsonse.json() уже не нужен, или я не прав? @Владилен Минин
Помню как мучался с созданием небольшого API на NodeJS с использованием пакетов MySQL, fs и http(s), где нужно было просто вернуть файл, перед этим найдя его в БД. Вот там меня и выбесил mysql пакет со своим коллбэком и необходимостью передавать в него request из пакета http, чтобы вернуть пользователю данные. Благо в пакете mysql2 был предусмотрен синхронный метод 😅
Спасибо большое за отличное объяснение! Не совсем понял момент с .then(() => { return fetch(url) } .then(response => response.json()) fetch() возвращает Promise, then() оборачивает все что в return в новый Promise. Получается, что результат then() - Promise? Как тогда последующий then() вызывает у этого объекта json() ?
На 6:35 для тех кому трудно понять, как и мне, избавьтесь от setTimeoute. Пишите пустой промис const p = new Promise((resolve)=>resolve()). Сам setTimeoute путает, да до этого он нужен был, чтоб эмулировать ответ от сервера, но тут путает дополнительным синтаксисом. Для понимания порядка выполнения кода, лучше раcставить в разных частях console.log
Было бы оч круто освятить ещё такие темы: деструктуризация, rest, spread, каррирование, метод flat у объектов, мемоизация, полиморфы/полифиллы, monkey patching... Да много ещё чего вспомнить можно. Просто это часто на собесах спрашивают, хотя на практике многое из этого практически не используется. Но для понимания каверзи знать стоит. Впрочем, автору виднее
Владилен! Спасибо за ваши уроки. Я часто смотрю ваши уроки на iPhone. Нельзя ли поменять черный бэкграунд на белый, чтобы лучше был виден код? Спасибо!
Я что-то поняла, неужели, офигеть! но боюсь что окажется, что рано радуюсь, что все-таки не поняла, потому что я не могу поверить, что я наконец это поняла. Спасибо Вам
2рую функию фетч туду чисто для того что бы это масивнее выглядело по сравнению с 3емя строчками. на самом деле мог бы 3тий .then дописать в той же функции дописать. и это выглядело по размеру почти так же. Причина тут лишь в понятливости, и каллбек функциях. И что оно яко бы приятней выглядит. Но на самом деле then тоже неплох. Но да, если есть возможность то лучше юзать асинк + авейт
Спасибо большое за видео) Очень доступно и понятно!!! Владилен, вы не могли бы снять видео про pwa во vue-cli3? Или оно уже есть, а я не нашла на канале?
Малюсенький вопрос: я правильно понимаю, что работа всей страницы при наличии такого кода останавливается до того момента, пока не выполнится "виртуальный промис" в виде таймера delay? Или это просто отдельный поток где js выполняет для конкретной функции свой код и затем возвращает его? Ну, то есть, если мы присвоим переменной эту функцию, к ней можно будет обратиться только через 2 секунды, и всё это время скрипт будет недоступен?
А как быть когда надо делать fetch запросы в цикле? Условно в коде который описал ниже, там где console.log хочу ещё помимо синхронно выполнить fetch запрос. Или вообще можно как-то более правильно чисто async await-ами всё переписать? let count = 0; function printer() { return new Promise(resolve => { setTimeout(()=>{ resolve(console.log('+2 sec...')) }, 2000) }); } (async _ => { console.log('Start') while (count
а как это можно применить в цикле? К примеру при прохождении массива циклом, если данные подходят по условиям, нужно выполнить еще две функции которые делают fetch запросы и нужно чтобы была асинхронность, чтобы сперва выполнилась getFirstData() потом getSecondData() и цикл корректно отрабатывал
@LuckyGamerTV Пока я фокусируюсь на frontend разработке и про базы в ближайшее время не планировал рассказывать Но ближе к осени вернуть и освещу эту тему
