Тёмный

Exercises: Async / Await - Javascript In Depth 

Tech with Nader
Подписаться 12 тыс.
Просмотров 3,7 тыс.
50% 1

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

 

29 сен 2024

Поделиться:

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 45   
@abdelhakimkhabir
@abdelhakimkhabir 2 месяца назад
Love it some much, community needs a lot of video exercises like this to profound our understanding. thank you again
@frq9293
@frq9293 Год назад
Thank you man, I looked at every video on promises/async I could find and yours were the best by far.. I really feel like I get them now
@Paul-xg1sg
@Paul-xg1sg 11 месяцев назад
Thanks Nader! This definitely helped me being more confident when working with Promises 👌
@644sixfortyfour4
@644sixfortyfour4 Год назад
I think I'm confident now using Promises as well as async/await any where thanks to you. I mostly needed to know about error handling as I didn't care for it before. 🤦‍♂ In the last exercise I think using a Promise is actually more readable.
@TechWithNader
@TechWithNader Год назад
That’s exactly what I love to hear! It’s a tricky concept so feeling confident with all its uses it’s huge 😊 And yeah, it’s very subjective especially with “smaller” examples like this which method people prefer. Sometimes a team just goes with one method as a standard that they all agree on too.
@fabioescobar5463
@fabioescobar5463 Год назад
You are awesome man! 🎉
@TechWithNader
@TechWithNader Год назад
Thanks Fabio, glad you're enjoying the videos! Just started up a Discord server too if you're interested in joining: discord.gg/K4nkugP7Gd 😃
@AbhishekSingh-bt6uo
@AbhishekSingh-bt6uo Год назад
sir to your 1st exercise one solution could also be this :- const fetchUser=()=>{ return new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve({data:{user:"Monkey",admin:true}}); },3000) }) } console.log('Program Starting'); const login=(obj)=>{ if("admin" in obj){ if(obj.admin===true){ console.log('Successfully logged in'); }else{ console.log('Failed to login in, please try again'); } }else{ console.log("Failed to login in ,please try again"); } } const func=async()=>{ const res=await fetchUser(); login(res); console.log('Program complete'); } func();
@TechWithNader
@TechWithNader Год назад
Hey Abhishek! Nice work on this! It's really showing that you're understanding this concept more inside and out, awesome to see! I like yours better since you are actually waiting for things in the correct order like the "Program complete". Well done 🤓
@AbhishekSingh-bt6uo
@AbhishekSingh-bt6uo Год назад
problem no 3:- using async await :- const sellCandies=(obj)=>{ return new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve(obj.quantity*25); },3000) }) } const goGetCandies=()=>{ return new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve( {candy:"sour keys",quantity:10}); },2000); }) }; const func=async()=>{ const obj=await goGetCandies(); const val=await sellCandies(obj); console.log(val); } func(); using default promise syntax:- const sellCandies=(obj)=>{ return new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve(obj.quantity*25); },3000) }) } const goGetCandies=()=>{ return new Promise((resolve,reject)=>{ setTimeout(()=>{ resolve( {candy:"sour keys",quantity:10}); },2000); }) } goGetCandies().then((resolve)=>{ return sellCandies(resolve); }).then((resolve)=>{ console.log(resolve); })
@TechWithNader
@TechWithNader Год назад
Hey again Abhishek! Great work! It's so important to get practice with turning the vanilla promise chains in to async/await and vice versa. Hopefully you agree that it really increases the understanding 🙂
@raajaggarwal7777
@raajaggarwal7777 Год назад
Before these exercises I was uncomfortable with async/await but after doing these exercises I feel much better. Thank you!
@Abulkhair1995
@Abulkhair1995 Год назад
I think I have much of the uderstanding regarding the promises
@aliajellu
@aliajellu Месяц назад
Great job Nader, this series has been so helpful. I was blazing through the code as I was writing it, although I'm sure I'll forget it all tomorrow lol
@blindmoonbeaver1658
@blindmoonbeaver1658 7 месяцев назад
I can't stress this enough how much this helped. Great work!
@mohsenrostami3335
@mohsenrostami3335 3 месяца назад
This was a great exercise for me to practice async/await, thanks a lot, that was so helpful for me🙏
@حسنزال-ي7ح
@حسنزال-ي7ح 5 месяцев назад
I have watched a tutorial about this on udemy but for more practuce i am gonna watch this
@canilreddy
@canilreddy Год назад
really nice videos
@namtranhai8150
@namtranhai8150 Год назад
Really good exercises and explanation, thanks a lot!!
@traezeeofor
@traezeeofor Год назад
Thanks for this excellent video. However there is an error in exercise 1. Promise should resolve to {user: "Monkey", admin: true} and not { data: {user: "Monkey", admin: true} } To test, give ChatGPT the exercise and then run the results it outputs Note that your instructions tell reader to do login(result); while what will actually give successful response is login(result.data);
@TechWithNader
@TechWithNader Год назад
Hey Trae, ah I see what you mean. I think the instructions could be a bit more clear as they state to "pass the user" to the "login" function. I guess this can be interpreted in a couple ways as passing the whole "result/response" object or just the "user/data" inside. Nice catch and love that you test it with ChatGPT, haha! 😃
@atalaguitare13
@atalaguitare13 Год назад
The comments directive are confusing! 16:31 You asked if the object has a property called 'admin' ect.... So you asked if there is a property with the name 'admin'. Why didn't you do like this: if(user.hasOwnProperty('admin') && (user.admin === true)) The comments directives are not followed thoroughly
@TechWithNader
@TechWithNader Год назад
Hey Aata, apologies for them being confusing - they were tricky to write succinctly on one screen 😄 You’re right, technically we should check for hasOwnProperty, however since we haven’t learned prototypes or prototype chains yet I’ve been leaving it out since I wanted to focus on the async concepts for this video. Love your check for the property though as it’s way more robust than mine! 🤓
@atalaguitare13
@atalaguitare13 Год назад
@@TechWithNader Cool tuto though
@KRAKENBACK..
@KRAKENBACK.. Год назад
Async-Awaits a blessing, on exercise 3 I forgot to set the function goGetCandies to a variable and got stuck for the longest lol. I did it super fast with the async-await function, but with vanilla promises it gets complicated super fast when your promises are wrapped in functions.
@TechWithNader
@TechWithNader Год назад
It really helps to be able to use this syntax for sure - especially when you're comfortable and understand vanilla promises like you do now 😊
@senniagordinskaya4051
@senniagordinskaya4051 2 месяца назад
Thank you!
@tobidurojaiye2464
@tobidurojaiye2464 Год назад
Needed This, Thank you so much Nader. Looking forward to learning more on here
@TechWithNader
@TechWithNader Год назад
You're very welcome Tobi! Glad you learned something and this was helpful 😊
@calvinsant7609
@calvinsant7609 Год назад
Hi Nader, thank you for the video again! Sort of unrelated but can you tell my why you prefer function expressions vs function declaration? Is it no beneficial to hoist functions or does it save memory or something else?
@TechWithNader
@TechWithNader Год назад
Hey Calvin! It's mainly because they are so common within callbacks and anonymous expressions, like within map/filter/reduce and stuff like that. Also, when you get to how the "this" keyword works, if we don't need to use "this" then we can also use arrow functions instead of "regular" functions. Generally, we shouldn't really rely on hoisting in general so I don't really consider that a plus haha 😊 That said... there are times where we absolutely do need non-arrow functions, so it's good to know both - this will be more apparent when we see the "this" context as I mentioned 😉
@calvinsant7609
@calvinsant7609 Год назад
@@TechWithNader Ok awesome, thanks!
@kinrev6719
@kinrev6719 Год назад
Thanks! Much needed exercises. Enjoyed a lot in this topic.
@TechWithNader
@TechWithNader Год назад
🥳
@siancalebdomasig5067
@siancalebdomasig5067 Год назад
The concepts of Promises and async were foreign to me, these lectures and exercises made me understand them easily. Thank you.
@TechWithNader
@TechWithNader Год назад
You’re very welcome Sian! These are tricky concepts but we will be using them every day with JS so it’s super important to really understand them 🥳
@bijay_magar5964
@bijay_magar5964 Год назад
Amazing video ! Can't wait to solve another exercise problems. Also will recommend it to my friends🥰🥰
@TechWithNader
@TechWithNader Год назад
Thanks again, Bijay! I’m glad you’re enjoying them and finding them helpful 😊 Can’t wait to make more exercises, hah!
@simplyskandi5973
@simplyskandi5973 Год назад
I'm having a bit of difficulty in understanding why the code below is logging Promise { } and then {candy: 'sour keys', quantity: 10 } In vanilla promise part of exercise-03, instead of using the resolved value from the goGetCandies function directly into the sellCandies function, I first saved the resolvedValue in a variable. When I log that variable, it logs Promise { } and then { candi: 'sour keys', quantity: 10 }. And then when I pass on this variable to the sellCandies function, its giving NaN. Could you please explain why I can't save the resolved value in a variable and when passed into the sellCandies function its not outputting 250 but NaN. I hope I havent confused you with my question!
@TechWithNader
@TechWithNader Год назад
That’s really interesting! Could I ask you to post what your code looks like to get that result? It should always give you the resolved value in the .then so something weird must be happening. My guess is that NaN comes from trying to do math with a promise or undefined instead of a number 😄
@dsstudios178
@dsstudios178 Год назад
For exercise 2 did you forget the last step 8? It ask how we could make it run faster, i believe i done this with Promise.all() const fetchBothFaster = async () => { const both = await Promise.all([fetchFast(), fetchSlow()]); console.log("#2 Both",both[0]); console.log("#2 Both",both[1]); console.log("#2 Time =",(new Date() - firstTime)); //around 6005ms, shaving off 2 seconds of fetchFast() } Would this be the correct solution for making it run faster?
@dsstudios178
@dsstudios178 Год назад
Welp now im an idiot XD
@TechWithNader
@TechWithNader Год назад
All good haha, glad you saw and figured it out 😃
Далее
Array and Object Spread Syntax - Javascript In Depth
41:50
Is PHP the new JavaScript?
16:18
Просмотров 7 тыс.
Async / Await - Javascript In Depth
44:23
Просмотров 3,4 тыс.
Tips For Using Async/Await in JavaScript
16:26
Просмотров 395 тыс.
Fetch API - Javascript In Depth
47:24
Просмотров 3,6 тыс.
Exercises: Objects - Javascript In Depth
50:54
Просмотров 3,6 тыс.
Promises - Javascript In Depth
52:03
Просмотров 5 тыс.
The "this" Keyword - Javascript In Depth
1:04:30
Просмотров 3,2 тыс.
Microservices are Technical Debt
31:59
Просмотров 346 тыс.