Тёмный

Efficient ES6 async await with fetch 

Steve Griffith - Prof3ssorSt3v3
Подписаться 102 тыс.
Просмотров 16 тыс.
50% 1

This video explains how to effectively combine async await functions with fetch and include proper error handling.
Code GIST: gist.github.co...

Опубликовано:

 

8 сен 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 50   
@gospodarsile4606
@gospodarsile4606 5 лет назад
Your videos are extremely well explained and contain quality content. However, your channel still doesn't have the number of views and followers it deserves to have. With this comment, first of all, I want to thank you for the knowledge you share with us and I also want to suggest an example of how to get more followers and viewers. I recommend that you create a bigger project, a realistic project that young developers face. May be divided into several small sections and unite to a playlist, or record it in its entirety for a couple of hours. An example project would be a CRUD application with ECMAScript 6+ standard. I hope that you will do something like that for your viewers. Have a nice day :)
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 5 лет назад
Eventually I will create full courses. It has been my intention for a long time to do that either on here or Udemy or SkillShare or BitDegree or some other place. I have been approached by several online schools to create courses. It's just a matter having the time. These videos I can do in a day as I have the time. Full courses take a long time to plan, develop, record and edit. I do these videos in my spare time on top of my full-time job.
@tedfitzpatrickyt
@tedfitzpatrickyt 5 лет назад
A MERN-stack PWA using oAuth and deployed using Docker. Just cause I’m learning how to do this ;-) Thanks Steve
@mohamedkhodary7831
@mohamedkhodary7831 4 года назад
Your Channel is like gold mining Steve, thank you for this fantastic explanation and the pure content you delivered , keep it up.
@mimishiba
@mimishiba 3 года назад
Wow that's a really neat way of error handling that no other channels have explained before! Definitely learned something valuable here. Thanks!
@roshinimala3759
@roshinimala3759 2 года назад
Thanks a lot Prof 😄Today I learnt something new
@PIRAKAS666
@PIRAKAS666 3 года назад
Great as always.
@MrSalFav
@MrSalFav 2 года назад
Thank you !! Really well explained and calm to watch and straight to the point. I watched alot of your vids and they are all really well made.
@maspoetry1
@maspoetry1 3 года назад
nice to see this channel getting big. i don't know a better teaching style
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 3 года назад
I appreciate that!
@MoDeadYT
@MoDeadYT 3 года назад
Today is a great day! It is the first day I have ever clicked the notification bell. haha
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 3 года назад
Thanks! :)
@giandomenicoriceputi6275
@giandomenicoriceputi6275 3 года назад
If want understand something I heve to follow your videos
@quaternion-pi
@quaternion-pi 5 лет назад
Fantastic content! (as always I learned new, useful techniques). Thanks for all your teaching.
@FranciscoJunior29
@FranciscoJunior29 5 лет назад
Another great class. Excellent job.
@iwswordpress
@iwswordpress 5 лет назад
Very good example, well explained.
@se7en2021
@se7en2021 3 года назад
Love your channel
@MoDeadYT
@MoDeadYT 3 года назад
Thank you so so so so much!
@olubisidavid7864
@olubisidavid7864 4 года назад
document.write("Thanks alot sir...these are awesome contents');
@mahmoudmiz3531
@mahmoudmiz3531 4 года назад
Great explanation, thank you!
@iliashterev38
@iliashterev38 2 года назад
Greetings from Bulgaria. Thank you (perhaps 5ht time in different comments) for your time and efforts to put those so valuable tutorials. One question please, if you have time - what about the regular try catch blocks inside the async funct. Are they not applicable here or this is just more appropriate (or should I say professional) way of coding ??
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 2 года назад
You can use the standard .then() method with catch() or try catch with await or a combination. As long as you understand how the different ways work feel free to use any approach.
@geraldmartinez3865
@geraldmartinez3865 4 года назад
Thanks a lot Steve. Good tutorial
@RajveerSingh-yb6zq
@RajveerSingh-yb6zq 3 года назад
Great. One Question though. In the End, Why data.code && data.code == 400 ???????
@RajveerSingh-yb6zq
@RajveerSingh-yb6zq 3 года назад
got it. First data.code check the code property availibity in the data obj.
@sabuein
@sabuein Год назад
Thank you.
@TheRegalboss
@TheRegalboss 4 года назад
Excellent!
@kirillbaryba746
@kirillbaryba746 4 года назад
Thanks, What I need!
@tezzarida
@tezzarida 5 лет назад
Thank you for the video! Can you please say which microphone do you use?
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 5 лет назад
Blue yeti USB mic
@ironmanlifts
@ironmanlifts 4 года назад
Thanks , await makes more sense now. What if you just wrap everything inside the async function with try {}catch{} ? Would that work the same as the handleErr function ?
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 4 года назад
You can put a try catch block around it but I prefer to use the catch( ) method that comes with Promises.
@chikaodili
@chikaodili 4 года назад
Thanks Steve! One question though; is it possible to return the data from function f in your example instead of logging it to console ? Trying to return "data" still returned a promised. Is there a way around this ?
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 4 года назад
response.json() returns a promise. We can add the then( ) method to data to get at the actual data.
@chikaodili
@chikaodili 4 года назад
@@SteveGriffith-Prof3ssorSt3v3 Many thanks
@carbonio14
@carbonio14 3 года назад
I need to extract a price from an cryptocurrency exchange url address. Using a fetch request and getting a json response (crypto symbol and price) how can I take advantage using async/await? I need only the price data. thanks
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 3 года назад
Using or not using async / await has zero impact on how you get to specific values in the data. With it, like I show in the video, you are passing the value back from the fetch().then().then( ) to a variable. Without it you just use the data inside the second then( ) function.
@dawidpomioto1595
@dawidpomioto1595 4 года назад
What about using try catch block instead of crating handleErorr function?
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 4 года назад
You can but then you are mixing the sync and async approaches. Just feels mismatched and inappropriate to me.
@misterl8129
@misterl8129 4 года назад
when we need to use asyn fetch vs a regular fetch??
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 4 года назад
You, as the developer, get to choose. They are two solutions that are equal and solve the same problem. What is your preference in coding...
@evilwarrior4095
@evilwarrior4095 4 года назад
why did you use two data.code inside if statement. im really new to this concept. please help me
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 4 года назад
The first one checks for the existence of a property called code inside the data object. The second checks for the value of that property. ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-OLXyquuM05Q.html
@evilwarrior4095
@evilwarrior4095 4 года назад
Steve Griffith thank you very much sir . i was so consumed with this async stuff that i literally forgot and didn't pay attention to the basics 😅. im dumbfounded right now. thanks to your tutorial im on the clear now .
@RajveerSingh-yb6zq
@RajveerSingh-yb6zq 3 года назад
@@SteveGriffith-Prof3ssorSt3v3 that we could have avoided with data?.code instead of data.code right?
@SteveGriffith-Prof3ssorSt3v3
@SteveGriffith-Prof3ssorSt3v3 3 года назад
@@RajveerSingh-yb6zq yes. But optional chaining still has limited support. It is still fairly new.
@adilismail3593
@adilismail3593 4 года назад
Messy code
Далее
Why Should I Use const in JavaScript
9:04
Просмотров 9 тыс.
Bike Challenge
00:20
Просмотров 21 млн
ПРОСТИ МЕНЯ, АСХАБ ТАМАЕВ
32:44
Просмотров 2,4 млн
Async & await in JavaScript
18:36
Просмотров 1,5 тыс.
Using FormData Objects Effectively
13:14
Просмотров 36 тыс.
Tips For Using Async/Await in JavaScript
16:26
Просмотров 395 тыс.
ES6 Iterator & Generator Fundamentals
18:18
Просмотров 31 тыс.
The Async Await Episode I Promised
12:04
Просмотров 1,1 млн
Intro to Async and Await
8:08
Просмотров 6 тыс.
JavaScript Fetch with Request and Headers Objects
16:26
JavaScript Visualized - Execution Contexts
11:41
Просмотров 54 тыс.
Bike Challenge
00:20
Просмотров 21 млн