ES6 #12. JavaScript Promise. Что это и как работает (+ запросы данных из Coffee API, Beer API и др.)

  Рет қаралды 31,431

Vasilii Muravev

Vasilii Muravev

3 жыл бұрын

Мой Telegram: t.me/stackdevru
В этом видео мы разберемся, что такое объекты promise (промисы), которые появились в редакции Javascript ES6. Посмотрим, как они работают и для чего используются.
Обещания (promises) в JavaScript - это новый инструмент для работы с отложенными или асинхронными вычислениями, добавленный в ECMAScript 2015 (6-я версия ECMA-262).
До появления «обещаний» асинхронные задачи можно было решать с помощью функций обратного вызова (т.н. callback функции), которые имели более сложный и неудобный синтаксис.
Плейлист курса ES6: • ES6 - Все Новые Фичи в...
Мы будем запрашивать и обрабатывать различные данные из настоящих API:
1) Countries API - данные о странах
2) Coffee API - виды кофе + ингредиенты
3) Wines API - виды вина + информация
4) Beers API - виды пива + информация
Мои Курсы:
Gatsby JS (полный курс): gatsbyjs.ru
React для начинающих: react001.ru
​Все мои курсы (+ исходные файлы): stackdev.ru
Подписывайся на соц сети:
Telegram: t.me/stackdevru
VK: vasilymur
Instagram: / vm_online
Мой блог о веб-разработке: stackdev.blog

Пікірлер: 96
@galievramil1169
@galievramil1169 2 жыл бұрын
Мне очень нравится канал, реальный разраб без понтов обьясняет
@stackdev
@stackdev 2 жыл бұрын
Спасибо!
@foumRU
@foumRU Жыл бұрын
Посмотрел несколько видео про Promise, но ваши примеры просто нереально крутые, - сразу всё понятно, реальная практика с очень понятными данными. Огромное спасибо!
@stackdev
@stackdev Жыл бұрын
Спасибо за поддержку!
@muhomor1987
@muhomor1987 11 ай бұрын
@galichandreyschool
@galichandreyschool Жыл бұрын
Какой замечательный контент! На реальных примерах без воды объясняете материал! Очень помогает изучить более детально и закрепить материал! Благодарю Вас! Успехов Вам в Вашей полезной и благородной деятельности! 😀
@stackdev
@stackdev Жыл бұрын
Спасибо!
@user-it9vi5gm9q
@user-it9vi5gm9q 3 жыл бұрын
Спасибо за контент, хорошая подача материала особенно примеры! также понравилось что вы приводите старый синтаксис, ждем от вас так же рассказ об итераторах, генераторах и многом другом
@stackdev
@stackdev 3 жыл бұрын
Спасибо! будем работать:)
@alexforos5425
@alexforos5425 2 жыл бұрын
Спасибо за видео. Отличные примеры! Наконец-то я понял как использовать Promise!
@artemsergeev4833
@artemsergeev4833 Жыл бұрын
Отличная работа, наконец нашел видео с примерами работы с API и получения из них данных
@vo_skor
@vo_skor 2 жыл бұрын
Очень доходчивые видео, спасибо за ваш труд!)
@stackdev
@stackdev 2 жыл бұрын
Спасибо!
@zakarhappy5496
@zakarhappy5496 Жыл бұрын
Я наконец-то начинаю понимать промисы, и в большинстве благодаря тебе, спасибо огромное и успехов тебе!
@stackdev
@stackdev Жыл бұрын
Спасибо!
@Rhythm_Men
@Rhythm_Men Жыл бұрын
Очень круто.Спасибо.Успехов каналу и продвижения.
@annashirinskaya7400
@annashirinskaya7400 Жыл бұрын
Отличное видео, и что очень ценно, что с реальными практическими примерами! Очень понятно объясняете, спасибо!
@stackdev
@stackdev Жыл бұрын
Спасибо!
@user-cd1sr5sx2r
@user-cd1sr5sx2r 3 жыл бұрын
Интересные примеры. Спасибо
@PieceOfInternet
@PieceOfInternet Жыл бұрын
Спасибо, как всегда замечательная и простая для понимания подача материала! Спасибо и удачи тебе)
@stackdev
@stackdev Жыл бұрын
Спасибо за поддержку!
@kennymccormick9103
@kennymccormick9103 4 ай бұрын
Большое спасибо!
@igorshved2224
@igorshved2224 2 жыл бұрын
Отличные видео, очень доходчиво и понятно все объясняется, всем рекомендую
@stackdev
@stackdev 2 жыл бұрын
Спасибо большое!
@WorldCitizen1984
@WorldCitizen1984 Жыл бұрын
Отличная подача! Как для меня новичка - идеально все показано! + примеры с доступный пониманием! Посмотрель 3и лекции по промисам - Ваша лучшая! Спасибо!
@stackdev
@stackdev Жыл бұрын
Спасибо!
@SerhiiParkhomenkoFingerstyle
@SerhiiParkhomenkoFingerstyle Жыл бұрын
Отличный урок! Спасибо!
@user-vj3hk5es7b
@user-vj3hk5es7b 8 ай бұрын
Хорош бродяга! Четко по делу и ясно , без соплей от Минина.
@stackdev
@stackdev 8 ай бұрын
Спасибо!
@maximkorolev7343
@maximkorolev7343 6 ай бұрын
Лучший!
@user-uf8nw6uc9z
@user-uf8nw6uc9z Жыл бұрын
замечательная подача материала! автору жму руку
@stackdev
@stackdev Жыл бұрын
Спасибо!
@ooldstar
@ooldstar 2 жыл бұрын
Отлично умеете обьяснять!
@stackdev
@stackdev 2 жыл бұрын
Спасибо!
@thedvlpr
@thedvlpr 3 жыл бұрын
Контент 🔥 спасибо большое!!
@stackdev
@stackdev 3 жыл бұрын
Спасибо за отзыв!
@user-gn5rr6rt1r
@user-gn5rr6rt1r 3 жыл бұрын
очень не плохо, достаточно полезный материал, спасибо
@stackdev
@stackdev 3 жыл бұрын
Спасибо!
@user-eg4gt7zc8o
@user-eg4gt7zc8o 2 жыл бұрын
Спасибо Вам большое, вы просто лучший! Пожалуйста продолжайте )))
@stackdev
@stackdev 2 жыл бұрын
Спасибо!
@GreekkAlex
@GreekkAlex 2 жыл бұрын
и что, вам сразу стало понятно что внутрь конструктора промиса передается функция, которая получает два коллбэка(резолв и режект)??)))
@scvorec77
@scvorec77 Жыл бұрын
классное объяснение по асинхру Promise спасибо огромное.. ))
@stackdev
@stackdev Жыл бұрын
Спасибо!
@diver1668
@diver1668 Жыл бұрын
Спасибо. Всё очень доходчиво.
@stackdev
@stackdev Жыл бұрын
Спасибо!
@user-ry9ic6lt9h
@user-ry9ic6lt9h 2 жыл бұрын
очень круто объяснено!
@stackdev
@stackdev 2 жыл бұрын
Спасибо!
@user-ic9hf3ps4z
@user-ic9hf3ps4z 2 жыл бұрын
Спасибо огромное. Очень полезно!!!
@stackdev
@stackdev 2 жыл бұрын
Спасибо!
@dimkagera6955
@dimkagera6955 9 ай бұрын
Нифига се, вот это круто )
@user-tc6pi1nc2r
@user-tc6pi1nc2r Жыл бұрын
From my point of view he is one of the best russian speaking js's coach
@stackdev
@stackdev Жыл бұрын
Thanx a lot)
@StorySieva
@StorySieva 2 жыл бұрын
Спасибо!
@user-mm3xq9kx2g
@user-mm3xq9kx2g Жыл бұрын
Ну наконецто!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! Понял !!!!!!!!!!!!!!!!!!!!!!!!!!!!!! Лайк
@Viktorres1
@Viktorres1 Жыл бұрын
Очень полезный урок. Апишка еще не раз пригодится.
@stackdev
@stackdev Жыл бұрын
Спасибо!
@vaspurakavdalian1133
@vaspurakavdalian1133 Жыл бұрын
Я просто в восторге от его уроков.Молодец ВАСИЛИЙ
@stackdev
@stackdev Жыл бұрын
Спасибо!
@vaspurakavdalian1133
@vaspurakavdalian1133 Жыл бұрын
@@stackdev Василий подскажите позжалуйста,как найти работу?Например вот я с другом изучаем с сентября месяца html,css и javascript в процесе.(вот вы меня и обучаете :). )Так или иначе разбераемся,есть собственные вёрстки сайтов,без переписи с интернета.Как вы думаете,есть кое какие мелкие проекты ,чем бы и мы могли подработать???как найти?
@vaspurakavdalian1133
@vaspurakavdalian1133 Жыл бұрын
@@stackdev Благодарю вас за понимание
@vaspurakavdalian1133
@vaspurakavdalian1133 Жыл бұрын
Честно говоря,в этот данный момент я смотрю ваши ролики :) 😀 Вы гений.
@stackdev
@stackdev Жыл бұрын
​@@vaspurakavdalian1133 Мелкие подработки это грустно с точки зрения денег и нестабильно. Изучать нужно основательно те вещи, которые используются в корпоративном секторе + желательно во всем мире.... Тогда проблем с работой и деньгами не будет)
@muhafilo4235
@muhafilo4235 6 ай бұрын
комментарий для пподдежки и продвижения ролика
@ioannhide3355
@ioannhide3355 Жыл бұрын
Вот сидишь смотришь на говно с миллионом просмотров, где говорят: давайте представим что получаем данные с сервера! И пихают в промис переменные, таймауты и ни одного рабочего примера!!! И тут ютуб подбирает видео где мало просмотров но так все по настоящему и понятно! Василий спасибо! Отличные примеры. Ведь для проектов именно работа с API а не с таймаутами или 1+1)))
@stackdev
@stackdev Жыл бұрын
Спасибо!
@RedShucov
@RedShucov 11 ай бұрын
согласен, автору плюс
@user-ed1jc6xl9r
@user-ed1jc6xl9r 3 ай бұрын
Классное обьяснение, классные примеры, но son выкинет ошибку
@masterswift9700
@masterswift9700 3 жыл бұрын
йоу крут чувак
@stackdev
@stackdev 3 жыл бұрын
Спасибо за коммент!
@Userffffff
@Userffffff 3 ай бұрын
Жалко, нельзя два лайка поставить:(
@user-tm9rd
@user-tm9rd 2 жыл бұрын
спасибо за видео! подскажете, пожалуйста, какая это тема vs code?
@stackdev
@stackdev 2 жыл бұрын
Спасибо! Dracula
@alexandershcheglov4653
@alexandershcheglov4653 3 жыл бұрын
Спасибо, за урок. Грыз эту тему на MDN было очень тяжко. Я только не совсем понял, как мы в getCoffee меняли coffee на coffee. Мы возвращаем объект в который при помощи spread копируем содержимое объекта нужного члена семьи, и тут же через запятую можно менять свойство?
@stackdev
@stackdev 3 жыл бұрын
Привет! Посмотри мои видео про Spread & Rest
@____Olga__
@____Olga__ 3 жыл бұрын
очень хорошая подача материала, не хуже , чем у человечка , названного в честь Ленина :)
@stackdev
@stackdev 3 жыл бұрын
Спасибо!
@GreekkAlex
@GreekkAlex 2 жыл бұрын
такая же фигня что и у леновлада. не объясняются такие подкапотные дела как, например, при вызове функции getMember, вызывается коструктор промиса? при его возврате или еще как то? как внутри промиса вызываются пустые ссылки на reject, resolve или они автоматом чем то заполняются? автор или сам не знает этих вещей или не договаривает. может это есть на его платных уроках, надеюсь?)))
@43445fgfgd
@43445fgfgd 2 жыл бұрын
@@GreekkAlex каких авторов по JS посоветуешь?
@user-qj2yg1rn3j
@user-qj2yg1rn3j 2 жыл бұрын
Спасибо, но мало ((
@fewart
@fewart Жыл бұрын
Подскажите почему response.ok если загружать локально заведомо несуществующий файл? async function fetchSvgData() { const res = await fetch('icon.svg') console.log(res.ok) // true, когда icon.svg не существует }
@user-gl8qs7qj4k
@user-gl8qs7qj4k Жыл бұрын
А я не понимаю зачем нужен resolve() и его собрат reject()... для чего намеренно завершать промис успешно или неуспешно, если от нас это не зависит... Василий, пожалуйста снимите ролик про этих двух помощников промисов... я просто теряюсь в догадках!
@user-xd6rk7th8b
@user-xd6rk7th8b 2 жыл бұрын
почему промисы это так тяжело для простых людей :( уже 10 видео посмотрела почитала мдн и все равно непонятно как их использовать и что это такое
@stackdev
@stackdev 2 жыл бұрын
Нужно прочитать 1 раз - и 20 раз сделать. И тогда понимание начнет приходить:)
@user-xd6rk7th8b
@user-xd6rk7th8b 2 жыл бұрын
@@stackdev вы правы) просто понимания, что писать нет совсем, расстраиваюсь, что мой мозг не способен осознать промис
@catsapp
@catsapp 2 жыл бұрын
Потому что промис -- это черный ящик, у него нет аналогий. Мы не знаем что происходит под капотом. Нужно выучить как с ним работать на примерах
@rustamtau7944
@rustamtau7944 Жыл бұрын
05:40 .then(countries=>countries) Что за конструкция такая? У меня не работает. Работает только .then(countries => {console.log(countries)})
@MrRasul121288
@MrRasul121288 Жыл бұрын
Мне кажется,что я никогда не смогу сам такое написать( так все сложно
@scvorec77
@scvorec77 Жыл бұрын
не работает sampleapis больше.. не показывает ссылки, открывается только фронтальная страница и все((
@stackdev
@stackdev Жыл бұрын
Странно... у меня работает
@GreekkAlex
@GreekkAlex 2 жыл бұрын
получается внутрь конструктора промиса мы получаем функцию, которая, в свою очередь, получает два коллбэка???!!! это момент надо ж уточнять!! а как будут платные уроки, и такие важные мелочи не будут учтены??!!! facepalm!!
@catsapp
@catsapp 2 жыл бұрын
Я тоже долго думал что такое промис, я понял, что его надо просто простить и принять как данность, таким какой он есть.
@GreekkAlex
@GreekkAlex 2 жыл бұрын
нихера не понятно: resolve, reject - это функции передаваемые в промис? какая из стрелочных функций в создаваемом промисе будет вызываться в качестве resolva, а какая в качестве rejecta. нагромождение стрелочных функций просто ради сокращения строчек кода!! а как же читаемость??!! ушли от callback hell-а, пришли к arrow functions hell-у!!!((((
@faizulla5838
@faizulla5838 2 жыл бұрын
Согласен хорошая подача материала, но если автор не знает чтото, то он тупо об этом помалкивает и идет дальше (в предыдущем ролике было >> и >>> а что это ХЗ товарищ майор, как говориться) ... вот 07:30 вроде new нельзя использовать со стрелочными функциями? или это с другой спецификации №6. Если вообщем, то нельзя было полнее дать применение?... все в кконсол ло в консол лог... а что дальше с ним делать???? все 12 уроков в консол лог... есть пословица" взялся за гуж не говори что не дюж" ... надо дело до ума доводить. представьте такой же урок-курс по электрике... и автор говорит... сегодня у нас домашняя разводка...ну вот 2 провода вышли мы их омметром прозвонили... напругу подали - индикатором протестировали, вот пробник фазу показывает, все вопрос закрыт... в следующем уроке делаем гараж. И что с этими проводами делать??? Жаль мало понимаю, взял курс на инглиш... так там от корки до корки... от А до Я... но не амриканский, а британец... половина пролетает.
@circusAnimal_
@circusAnimal_ Жыл бұрын
Простите, конечно, но это вообще не урок по программированию, а поверхностный обзор на 5 мин и далее куча всякого кода с примерами, которые и так можно найти. Кликбейт короче. С таким подходом никакой концепт понять нельзя, тем более такой сложный как промисы.
@ANTON_BERG_MINSK
@ANTON_BERG_MINSK 8 ай бұрын
Дааа ну и наглость...
Урок 5. JavaScript. Promise. Что это, как работает (+ пример)
23:18
OMG🤪 #tiktok #shorts #potapova_blog
00:50
Potapova_blog
Рет қаралды 17 МЛН
Stupid Barry Find Mellstroy in Escape From Prison Challenge
00:29
Garri Creative
Рет қаралды 21 МЛН
The joker's house has been invaded by a pseudo-human#joker #shorts
00:39
Untitled Joker
Рет қаралды 10 МЛН
Промисы в Javascript
21:55
JS ACADEMY – Vladyslav Grybennikov
Рет қаралды 29 М.
Промисы в JavaScript [Полный курс 2023] для новичков
49:17
Какие-то уроки
Рет қаралды 10 М.
Узнай JavaScript лучше: как работать с Promise - then, catch, finall, Promise.all(), Promise.race()
14:53
JAVA И SКРИПТЫ, ссылка на новый канал в описании
Рет қаралды 23 М.
JavaScript Promises In 10 Minutes
11:31
Web Dev Simplified
Рет қаралды 1,7 МЛН
OMG🤪 #tiktok #shorts #potapova_blog
00:50
Potapova_blog
Рет қаралды 17 МЛН