Просто o async, await. Без циклов и таймеров. JavaScript

[@ildarjakparov4887]

4:16 - порядок такой не потому что запрос к серверу дольше, а потому что fetch возвращает промис, а промисы исполняются после основного стека вызова, так как сидят в microtask queue.

[@ivomeadows]

топовый коммент. об этом надо было рассказать

[@faizulla5838]

те если делать async/await без fetch то порядок будет любой? Спасибо

[@ivomeadows]

@@faizulla5838 функция async всегда возвращает промис

[@АндрейИванов-ц3к2л]

Интересно, а где в данном случае основной стек вызова?

[@oleksandrs7407]

Крайне важный коммент, в топ.

[@АлександрГригорян-п5ш]

Долгих лет здоровой жизни вам!) Всегда радуйте нас вашим понятным контентом!

[@omnomnom1323]

ну наконец-то!!!! хоть где-то реальный кейс с запросом на сервак без этих сеттаймаутов! Спасибо)

[@olexanderChorny]

Через какие мучения пришлось пройти, что бы это понять! У вас максимально доступно, большое, человеческое спасибо)

[@ДанилДмитриев-я5м]

да хватит это легко

[@grach1993]

Было понятно, но всё-равно в уме витали какие-то сомнения. Благодаря такой подаче они полностью развеялись. Спасибо

[@pavel7930]

Это гениально! Большое спасибо ! Самое понятное объяснение которое видел когда либо!

[@OlyaPoy]

Огромное спасибо. Благодаря вашему обьяснениям смогла ответить на вопросы на собеседовани и меня взяли на стажировку!

[@braingriffin946]

Как дела спустя год?

[@anti_middle_ages]

@@braingriffin946 Видимо, плохо

[@ФорменШульц]

да как у вас дела?

[@avs1978]

Посмотрела видос, взяли на работу, за это время никто не оставлял комментарии под видео и она написала первый комментарий. Автор, самому не смешно?

[@ФорменШульц]

​@@avs1978в чем прикол?

[@ТатьянаХоружая-ц1н]

Кучу видео посмотрела и пришла к итого, что ваши видео самые доступные, а также результативные! Огромное вам спасибо!

[@AnonAristotel]

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

[@dimape.4180]

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

[@AnonAristotel]

@@dimape.4180 Нет, давайте делать это, покуда будем ожидать (await) выполнение асинхронных вызовов.

[@dimape.4180]

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

[@AnonAristotel]

@@dimape.4180 В том то и дело, что с await это выглядит как обычный синхронный код. Это не go рутины и не фоновые задания 1С. Кстати почти те же йайтса в 1С, только там сначала реализовали через широковещание - ОбработкаОповещения, а потом через Acync (Асинх) Await (Ждать). И в такой конструкции результат выглядит как обычный синхронный код. Только выполняется раз в 10 медленнее. А знаете почему? Потому что 1С тоже имеет (какое слово то гадкое) web клиент. И проблема в том, что браузер ругается на синхронные вызовы и не даёт их выполнять. То есть средство просмотра (браузер) де-факто устанавливает правила для языков программирования и фреймворков.

[@dimape.4180]

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

[@НиколайСтепанов-ю3м]

Самый лучший канал по JavaScript, постараюсь и платный ваш курс пройти!

[@evgeniy3224]

У вас всегда уроки понятно о сложном. Большое спасибо, было очень полезно. Размял свои мозги!))

[@Kras99free]

Лучшее объяснение асинхронности из всего что есть на русскоязычных ресурсах!

[@kenanhaciyev3759]

это лучшее объяснение async await что может быть вообще!!!!!!

[@katemos4584]

Александр Лущенко лучший блогер, коучер и программист. Спасибо огромное!!!!!!!!!!!!!!

[@adinaijamangulova2596]

один из лучших каналов по веб-разработке! ВСе понятно и ясно!

[@екатеринапанасюк-и6ч]

Вы отличный учитель!Спасибо Вам большое!

[@МилаяЛюбимая-ч3к]

Спасибо за объяснение, единственный кто легко донес смысл async await)))

[@venzeldv]

Лучшее описание, что мне встретилось.

[@_l.e.n.y_4956]

Ви найкращий вчитель IT

[@RomanKaras77]

Александр, всегда с удовольствием смотрю ваши видео, хоть вроде и не новичок ). Не примите за занудство, но попробуйте писать в vscod-e не console.log(), а просто log и клавиша Tab. И перемещать строки или выделенные фрагменты кода, когда вы меняли, например местами функции f1() и f2(), можно Ctrl + Shift + стрелки вверх/вниз )), а не копипастом. С уважением. Спасибо за ваш труд, жму руку. )

[@untiweuntiwe7415]

Про log + tab тоже не знал. Только log + enter. Спасибо)

[@RomanKaras77]

@@untiweuntiwe7415 я кстати, далеко не сразу в работе с вс-кодом узнал про передвижение строк и очень был обрадован этой фичей )

[@АлександрСмирнов-ы5т7ч]

Спасибо , очень полезно!! понятно все очень!! теперь не много перепишу свой телеграмм-бот.

[@user-lilya]

Спасибо, очень полезное видео! наконец-то поняла тему.

[@alexfargo6336]

Большое спасибо, Сань, твоё видео помогло мне выйти из ступора и решить мою проблему)

[@ИгорьКосач-ф8л]

Это очень грамотно разжевано. После 5 -6 видосов на эту тему, этот самый лаконичный и понятный.

[@oleksandrkotovskyi4203]

как всегда шикарно рассказано на пальцах

[@DmytroZaika-hn7wx]

Спасибо большое, это четвертое видео которое я смотрю на эту тему и только сейчас стало понятно

[@TONY_BERG_MINSK]

Чертов Гений❤❤❤🎉

[@тоталіспайс]

Шикарно, как раз на главе по асинхронности в Eloquent JavaScript и понимаю, что это видео хорошенько мне поможет) Спасибо

[@tihunvolkov9288]

Наконец-то, без таймеров, на нормальном реальном примере, ободряю.

[@alla6361]

Спасибо! Стало понятнее!

[@ОлегСавл]

Спасибо огромное, у Вас очень хороший подход и объяснение технологии. Успехов!

[@andreybalatsan9336]

Спасибо огромное, посмотрел уже 3 видео и на вашем все встало на свои места

[@sedovolosyi]

Суть понятна, спасибо. Функция go имеет лишний async, ну это мелочи

[@sergeyplotnikov5031]

Спасибо за такое простое и понятное объяснение

[@gom-jabbar]

Благодарю

[@yuriyovdeyev685]

Толково! Спасибо за пример, очень наглядно и понятно.

[@АнтонНевероятный]

Действительно полезное видео, объясняющее работу асинхронных функций

[@КириллДубасов-ф7б]

Лучшее объяснение асинхронности, огромное вам спасибо!

[@asgard1428]

Все равно до конца не понял. Но это лучшее объяснение что я видел. Спасибо!

[@ИванНазаров-р8л]

Александр не лучше ли для эмуляции сервера использовать jsonplaceholder ? мне кажется будет нагляднее и интереснее

[@Olena_salii]

Очень хорошее обьяснение для новичков! доступно! благодарю!

[@АлександрБуров-п1м]

Спасибо, только после этого видео наконец понял что это такое!)

[@ПолинаКызылова]

лучшее видео эвер, спасибо большое!!!

[@Olegio_Y]

Спасибо что делаете упор на простоту обьяснения

[@valerakuznetsov]

спасибо громадное Вы один кто так доходчиво рассказал

[@mike-aaa]

Ради этого урока я написал свой сервер! 😎

[@SputnikovoeTV]

Не совсем пойму разницу с Промисами( фетч вернет промис, и зеном обработаем по цепочке и по сути это тоже самое?

[@mediavova407]

Огромное спасибо!!! Всё доходчиво на 150%, закрыли мои многие вопросы

[@araslanrus]

Наконец то без циклов и таймаутов

[@ИльяЗахаров-е3э]

Спасибо) Очень подробно объяснили)

[@valentyn996]

Отличное объяснение, спасибо за старания!

[@Lunar66]

не ожидал вас тут увидеть:)

[@valentyn996]

@@Lunar66 😎😎

[@niteilcaesgo2907]

Большое спасибо за видео! очень понятное объяснение!

[@karenmelikyan377]

Гениальный язык. И без async функция асинхронна и с async асинхронна. Главное, надо было все сделать работающим асинхронно, а потом выдумывать кастыли как все это синхронизировать. Просто гениально.

[@maratkamaletdinov9017]

Единственное, что понял, что асинхронность нужна, чтобы функции работали синхронно. Потому что без асинхронности они работают...асинхронно.

[@_Iokanaan_Marusidze_]

Спасибо, Александр ! Вы один из тех немногих кто расказывает о сложном простыми словами и способствует развитию хода мысле в ученике. По моему разумению именно таким и должен быть настоящий УЧИТЕЛЬ. ------------------------- Посдскажите пожалуйста, какие инструменты нужно задействовать в JS чтобы добиться четкого выполнениея таймингов ? Мне нужно чтобы функции вызывались с четкой переодичностью в 1сек и 500мс и весьма желайтельно чтобы этот таймер имел общее основание с Date(), поскольку именно оттуда я беру текущее время.

[@_Iokanaan_Marusidze_]

@@enjoymtx , не получается его отследить потому что тайминги Date() и Setinterval просто не совпадают. Может в системе Можна как то выйти на единый источник тактирования ? Здесь нужно понимать тонкости работы движка js.

[@_Iokanaan_Marusidze_]

@@enjoymtx , к примеру. Через setinterval я вызываю ф-цию каждую секунду, в начале этой ф-ции я проверяю равны ли мс обьекта Data() нулю. И вот здесь и трабла, они никогда не равны нулю. Как тогда я спрашиваю выдержать точные интервалы ?

[@ПращурАмбатьелло]

это делается через рекурсивный setTimeout

[@ИванВерушкин-в7ю]

А как правильно перебрать циклом этот res? То есть, допустим, запрос возвращает некий массив данных, а мне из этого массива нужно что-то конкретное выводить в консоль или на экран.

[@tazorprod.934]

Очень доступно объяснили такую сложную тему, спасибо

[@annajegorova6120]

Спасибо за видео, простой и понятный пример!

[@СергейКузнецов-т4р]

Очень благодарен. Лущенко the best ))))

[@knuckless__]

дуже доступно та легко дякую)

[@МишаАстахов-ю2д]

Наконец то, классно обьяснил ! , уникально, супер, понятно !

[@andrzeyshliaha5302]

Здорово, все по делу без воды, спасибо

[@andrzeyshliaha5302]

Правильно я понял, если например потом с данными нужно делать определенную логику а не просто текст, например в функции f3 то мы там просто ее и пишем ?

[@kapwas]

Что будет, если асинк авэйт оставить только у обертки, а сами ф1-ф3 обычными обозвать без авэйтов внутри?

[@СултанТемирбай-и8я]

и человек и видео прекрасны спасибо большое

[@aleks6607]

Спасибо)) очень помог ваш видос))

[@АлексейЛоскутников-ю4р]

Хороший пример, спасибо. Еще можно разобрать на вашем примере обработку ошибок при асинхронных запросах. На простых примерах, как правило это упускают, а на продакшен без этого никак.

[@sega21rus98]

просто в async функции используешь try-catch и все

[@donatelodonatelo383]

Фактически я могу и не взять в async каждую функцию по одельности? Ведь возможно каждую синк функцию сделать асинк с добавлением awair в начале?

[@bunnybugs6623]

Все супер, но Все же нужно пересмотреть, очень интерестно работа над ошибками

[@xelth]

при авейт ждет только эта функция или оно тормозит функции работающие в паралели?

[@МастерЙода-я4ю]

Спасибо, помог разобрасять с промисами и эсин эвей.

[@maksymkyryliuk492]

Good work. Awesome explanation!👍

[@georgepetrosyan4589]

Александр,как всегда респект. Наконец-то, кто-то понятно и на пальцах объяснил асинк-эвеит. А с помощью промисов, такого же результата можно добиться, посмотрев вашу лекцию про промисы?

[@sergeyilyin756]

Это определено одно из лучших объяснений, а самое главное без таймаутов и интервалов со стрелочной функцией, который только запутают новичка. Спасибо, подписываюсь!

[@digitalturkistan1857]

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

[@gordonfram]

@@digitalturkistan1857 нет. Данный автор никак не хвастается и не "намекает" на то, какой он классный программист

[@sergey6661313]

А если я хочу дождаться выполнения первых двух функции, и только потом выполнять третью. Как в таком случае написать код таим образом чтобы вторая функция не ждала при этом первую?

[@Das.Kleine.Krokodil]

0:23 так вы рассказываете про асихроннные функции или про то как асинхронные сделать синхронными?

[@КостянтинПавлов-ж7ж]

Просто показали но есть вопрос. Где у нас здесь после async/await осталось асинхронное выполнение кода? То есть как реально будет отрабатывать код? Ждать все await? Тогда это может быть долго.

[@yaroslavzef7267]

Круто. Не знал за такую тему! Спасибо

[@dreadwood]

Доступное и понятное объяснение, спасибо. Интересно посмотреть код сервера. Может есть пример где-нибудь на github?

[@HeorhiiHryhorian]

Очень хорошее видео! Спасибо за труд!

[@pypypy4228]

Наконец-то стало понятно, что async await фактически делают из асинхронного кода подобие синхронного.

[@aleksey220280]

Очень доступная подача. Спасибо!

[@faizulla5838]

Извините , Алексей а если порядок не важен, главное чтобы не ждало и работало - async/await применяем или старый вариант? если да то как?

[@АлександрЛавренюк-о9ь]

Подскажите, как с помощью async/await дождаться появления DOM-элемента и выполнить с ним действие? За урок спасибо!

[@Alias_s]

document.addEventListener("DOMContentLoaded", function(event) { //do work });

[@DAROM-TK]

Спасибо за видео, вроде все понятно и очевидно, но полнз читать на официальный сайт про асинхронность, и снова запутался. В официальном примере код выполняется последовательно, там запускают рисование миллиона шариков, и пока они не нарисуются, следующий за ним алертт не выполняется, баузер зависает. В Вашем же примере как раз этого нет, выводы в консоль выполняются именно , что быстрее то и выводится. Как так получается, в ситуации с шариками все идёт последовательно, а при выводе в консоль нет? Вот пример оттуда function expensiveOperation() { for(let i = 0; i < 1000000; i++) { ctx.fillStyle = 'rgba(0,0,255, 0.2)'; ctx.beginPath(); ctx.arc(random(0, canvas.width), random(0, canvas.height), 10, degToRad(0), degToRad(360), false); ctx.fill() } } fillBtn.addEventListener('click', expensiveOperation); alertBtn.addEventListener('click', () => alert('You clicked me!') );

[@GGSoft2009]

Ну это и лекция. Спасибо больщое

[@АрсенМахмудов-н2д]

С меня подписка! Вот так нужно объяснять чайникам))

[@GTar1998]

Все просто и понятно. Спасибо

[@dilmurodshernodirov5984]

Спасибо за видос ждём по больше ещё

[@sekirogenshiro2210]

Спасибо! Наконец то все понятно стало!

[@dinarsharipov5022]

Спасибо.наконец понял я как правильно прописывать асинк эвэйт, единственное, наверное можно было бы внутри каждой функции не прописывать async await? или обязательно дважды прописывать??

[@alyu6351]

А мы разве перед res.text() не должны поставить await? return await res.text()

[@RinatWOT]

Спасибо большое! Очень круто объяснил

[@extreme_pw]

Будет ли правильно написать fetch запрос после await внутри функции go, чтобы не плодить избыточные функции (f1,f2,f3) ?

[@MrBioneto]

Офигенно объяснили!!! Спасибо!

[@ruslan4090]

Давно хотел спросить, допускается ли следующее написание кода, или это плохая практика? function f1(arg) { // какой-то код f2(arg); } function f2(arg) { // какой-то код f3(arg); } function f3(arg) { // ещё какой-то код } f1(arg);

[@a89028724007]

спасибо, теперь понял

[@alexforos5425]

Спасибо большое! 👍

[@nasibasgarov9644]

Правильно, ли я понимаю, что это работает только если возвращается промис? Т.е. получается, что фетч, всякие аксиос возвращают промис?

[@Synchro13]

Огромное спасибо! просто и понятно

[@ForseNight]

Лучший айтиевангелист

[@itgid]

Не. Максимум айтиатеист. Я за то что айти не является чем-то недостижимым.

[@mikhailurban1222]

как всегда супер!