How Async Javascript works (Callback Hell, Promises, Async Await, Call Stack and more)

Рет қаралды 83,304

Күн бұрын

Check out my web development courses here 🔥
developedbyed.com/
🛴 Follow me on:
Twitch: / developedbyed
Twitter: / developedbyed
Instagram: / developedbyed
Github: github.com/developedbyed/
#programming

Пікірлер: 132

@developedbyed Жыл бұрын

I think it would be really fun if we did a series on focusing on one specific aspect of Javascipt and make a fun series out of it! Example: A full episode on event handlers (how to make a custom one, how it works, etc etc) 👀 Let me know if you like the idea 🔥 Anyone playing Street Fighter 6?

@yoJuicy Жыл бұрын

Great ideas Ed! thanks for teaching. Youre hitting 1 million this year bro! I love the idea of intermediate/advanced concepts because often times people explain things shallowly in their examples (for time) so its difficult to understand concepts when you want to use them in your own way. Other concepts that are kinda important: prop drilling (now with client & server comps this is critical) Closures [functional programming], prototypes, OOP, event loop, Linked list, Hash, BFS, DFS. Cheers

@belkocik Жыл бұрын

That would be nice :)

@dev_franqqi Жыл бұрын

That sounds fire

@joseduargu Жыл бұрын

amazing idea

@marshall-brown Жыл бұрын

Yes, full send that idea!

@robgioeli Жыл бұрын

I’ve been coding for close to 8 years now and have been been watching videos for quite many years and I’d just like let you know that your recent videos have been gold. I think the basics and creating clones of apps are long overplayed and many people will benefit from videos like this. Awesome teacher, would love to see you teach people more technical stuff like you have been the last month 👍🏻🔥

@patricklemmer-adeveloperss3458 Жыл бұрын

THE best video I personally have seen about these concepts. I have started learning how to code early last year and JS is still very difficult for me at time. This video has helped me understand things in 30 mins that I have not understood in the last 1.5 years. Huge compliment and please keep doing these basic concept JS videos, they are gold!

@gambomaster Жыл бұрын

Thanks again my gorgeous teacher on the internet. 🙏

@FaithFedora 8 ай бұрын

Love it 😂😂😂

@JanakiNarayana-cm8fn 4 ай бұрын

😂😂😂

@RychAhlberg 11 ай бұрын

You’re so good at explaining thoroughly. Thank you very much!

@annawolf8540 Жыл бұрын

Great timing! I‘m working as a react developer for 1 1/2 years now and sometimes I‘m just not aware of some of this concept. This was super interesting to get a little refresher and a deeper understanding!

@yanndjoumessi7130 Жыл бұрын

That's definitely a great video to put everything in context. I personally would like to see such a format with different JS topics. I don't think that it's really entertaining but for people loving to understand deeply what's going on, it's definitely a much better approach.

@anonygsc6851 Жыл бұрын

Hi Ed, I really appreciate your videos as i decided to use a JS framework to rewrite a project that was pooly optimised in a different technology. It really helps to watch someone when reading docs becomes tiring. Thanks

@alfiartya23 Жыл бұрын

As always, the way Ed teaching me with his funny way that makes me easily understand again about this context. I remember first time I learn Javascript is from Ed JS playlist, so thank you so much Ed! 😄

@maherylala2153 Жыл бұрын

Really waited for that one from you, thanks !

@RVAraghav Жыл бұрын

I have been following you for many years now and the excitement never stops when I see your video every time. Btw the video clarity is fantastic. What’s the camera you’re using? ❤

@enigmaSpy Жыл бұрын

Nawet nie zdajesz sobie sprawy jak bardzo długo szukałem tego typu video, spadłeś mi po prostu z nieba❤

@naczelnypsycholog6296 Жыл бұрын

to jest Polak ?????????????????

@ichiroutakashima4503 Жыл бұрын

I love this. Always good to watch such concepts because it's a refresher.

@user-tl5js5ow3d Ай бұрын

This is the first KZfaq video that made me happy, thank you my friend, I've wanted to understand this topic for so long and finally I found someone who could describe the workings of JavaScript so thoroughly.

@DawFa10 Жыл бұрын

Great video, and really well explained on the different concepts!

@aftonlawver3827 Жыл бұрын

Great explanation of the call stack vs the web API's and event loop!

@encourage-fm3fo Жыл бұрын

This was fantastic! Exactly what I was looking for.

@realworldcodingapplications 11 ай бұрын

i absolutely enjoy this kind of humor when I'm learnign to program, so thank you for that! Makes learnign much less mind numbing

@Ndzzle Жыл бұрын

SetTimeout is a webAPI. This gets handled by the browser instead of JavaScript. So instead of going staight into the queue, it goes into the WebAPI stack until the time is up. Then gets pushed into the queue, behind the other logs which is why it shows up last

@CristianKirk Жыл бұрын

Super nice to see actual programming in this channel and not just trendy frameworks conventions.

@shs4293 Жыл бұрын

Been working on Js since years but trust me, haven't found callbacks & promises being explained like this, even a junior dev could understand this without any hassle.

@saadafm Ай бұрын

This is EASILY the best video on these topics

@paulthomas1052 Жыл бұрын

Great demo and explanation. Cheers !

@testingBuyer 5 ай бұрын

wonderful and precise tutorial ,wins a subscription

@ways. 3 ай бұрын

this is my new favorite channel

@cmdrTremyss Жыл бұрын

Love the new format, I think I finally get how async works

@iitz_danny Жыл бұрын

I just had an interview that went over these concepts too. Wish I would have watched this video beforehand. I’m definitely turning on the notifications now😅

@anandumdharan6283 Жыл бұрын

Much needed bruddah......thanks a lot ed

@kimhwanhoon Жыл бұрын

Love it thank you so much man!

@diganta64 7 ай бұрын

One of the best session watched..:)

@hiafraan 7 ай бұрын

Thank you for the great explanation! ❤️

@deepanshusharma9311 Жыл бұрын

WOW🤩 Very nice Explanation

@justfun591 11 күн бұрын

This video is must watch if you're are going for an interview

@CryptoDaddy100 Ай бұрын

Hi Man I am seeing you after three years thanks good your video very help for me when I am fresher

@mostafakheder7721 Жыл бұрын

Nice work , I believe this episode is great

@user-kb4le4me2d 7 ай бұрын

Thank you! Good and useful content 😎

@bareenlars 3 ай бұрын

Hi, great video! New to promises and await, @26:45 why do we need to await when creating the const data ? isnt the variable response already set/saved? or is it just a placeholder for the function? If so, the await command is already in the response variable. Just trying to understand :)

@momomadi2 8 ай бұрын

nice explanation -- thanks bro

@deepakroy3459 11 ай бұрын

I am telling you,This guy is a GEM❤

@KaiaLoken 3 ай бұрын

Thank you for this

@Richard-LaFleur Жыл бұрын

9:28 Shouldn't it get pushed one by one, only when previous removeTodo() finishes and call stack is empty, and not everything at once?

@SarveshSawant-zk7xy 8 ай бұрын

02:13 - Two types of context 06:54 - first console log, third and then second is called because of call stack 08:22 - Call Stack 14:54 - Call Back Hell 19:50 - Custom Promise Example 22:43 - Real word promise example 26:35 - Async and await example

@ashmitsharma9096 Жыл бұрын

Correction: 9:36 CallStack works on LIFO and Callback queue works on FIFO. ⚠Warning Your this video is now obsolete: kzfaq.info/get/bejne/lZ6Xe6tz0cjemas.html&t

@vinci-g 11 ай бұрын

"Time's up m*therf*cker!" Had me on the floor rolling LMAO

@ahmadbilalfarooqi5731 Жыл бұрын

i gona revised function and your teaching way is sooo awesome async function is more than easy by Promise

@es2cs Жыл бұрын

7:55 im going to say this everytime I run a setTimeout from now on 🤷‍♂️😂

@joshuamackinnon1250 Жыл бұрын

Great video!

@fried-eggscelleration 4 ай бұрын

Nice video, but how can I get a value from the response returned as part of the function? Seems like the return value of a async function is always a promise? how can I get even maybe a wrapper function to just give me a string in the end, after waiting for the result?

@endritibra4351 Жыл бұрын

This was a masterpiece by Ed, a comment from an experienced developer

@getrogo4474 11 ай бұрын

7:56 caught me off guard hahahahahaha

@JohanDeGroot1982 Жыл бұрын

THANK YOU!!!

@ankamsarav 4 ай бұрын

I feel the remove function which you showed stacking in call stack section is wrong because queue will not push the functions unless the stack is empty

@nickveldkamp5396 Жыл бұрын

Do u create also a video about Axios ;) ?

@fullstackspiderman Жыл бұрын

@Ed, could you please create testing React App courses or KZfaq videos using RTL, Vitest for unit and integration and Cypress for E2E testing

@AyanleDirie Ай бұрын

what extension do you use to have icons like that?

@parsina4971 8 ай бұрын

thanks pal❤❤

@chaimaegrich4510 8 ай бұрын

Hi Ed, can I get the name of the music in the background please

@jayaprakash_dev 10 ай бұрын

do the web APIs run in different threads?

@CalmConcept Жыл бұрын

Are you using an OLED tv as a monitor?

@nasratt Жыл бұрын

What is that VSCode theme? anyone knows?

@robgioeli Жыл бұрын

Hey ed 👋🏼 also if you like live wallpaper, Razer makes amazing high quality software that I think called Cortex? High quality live wallpaper 👍🏻 best I’ve used!

@mjbalcueva6485 Жыл бұрын

anyone knows what his vscode theme is? it looks really clean awesome vid btw, keep it up

@CodeOnBlocks Жыл бұрын

Did you figure out what the theme was called? I can't find it.

@srikarravoori124 6 ай бұрын

After a long, I see you. By the way seeing your video I happened to become a software engineer at the age of 41 and completing 3 years now

@chhavimanichoubey9437 Жыл бұрын

I was unable to hold myself when you said 2000 seconds.

@Pareshbpatel Жыл бұрын

Async JS; nicely explained. Thanks, Ed {2023-06-27}

@Antonio-yn4mb 11 ай бұрын

When your team leader is Samuel L. Jackson 7:55

@vitaminprutin8217 Жыл бұрын

loved it

@aps69 Жыл бұрын

Add those chapters Ed

@apex-lazer 7 ай бұрын

Faking luv you eddy Boiii!

@kvebalas5931 10 ай бұрын

9:30 First in First out doesn't work that way. It pushes on top, but process the first (oldest) one on the bottom.

@zeusor 9 ай бұрын

He meant Last in First out LiFo I guess

@juliensavary Жыл бұрын

worker threads are changing the single threaded nature of js

@vanshshah7781 10 ай бұрын

Amazing

@Terms-and-Conditions Жыл бұрын

Would it look better if you flip/mirror your camera horizontal? so it looks like you are looking at the actual content while showing it to us

@Kuramas_Chakra 9 ай бұрын

Microsoft's True Intention Leaked at 7:18 !

@morale3056 Жыл бұрын

Damn! Nice and easy!

@zeusor 9 ай бұрын

I think he meant Last in First out LiFo 9:36

@andrewSantosMaia 10 ай бұрын

You re really funny!

@TJPBataller 4 ай бұрын

I thought callstack is FILO. or FIFO? not sure anymore.

@TUSHARMORE_09 Ай бұрын

Thanks! to Gorgeous teacher on internate 💝❤

@anony88 Жыл бұрын

Ed I need another video like this but explain it to me like I'm 12 lol

@manshulduggal5482 11 ай бұрын

2:30

@SebastianOnofrei 7 ай бұрын

I was very concentrated on what you explain then you came with the ' tick tac , tick tac , tick tac , time is up mothafucka' :)))) MY BELLY HURT BECAUSE OF LAUGHING . Other than that , excellent explanations ! Multumesc frumos ;) !

@gorkemtr Жыл бұрын

thks, take care of your health

@MaxenGaynier28 Жыл бұрын

Dr. Strange is teaching programming now? That's cool..

@pfcokelly Жыл бұрын

Tik tok, times up MFer. Great lesson!

@singingrockstar9698 10 ай бұрын

😂😂😂 tick tock tik took tiMesuP !!!😅

@naczelnypsycholog6296 Жыл бұрын

love the sweater❤, no homo

@Rashik25 Жыл бұрын

😊 Awesome

@G9tvlivenews Жыл бұрын

🎉

@salotspread 5 ай бұрын

putangina you described it the best very noice moite i subbed.

@user-mo1qs8kl5o Жыл бұрын

7:43 --> *ms

@dennisbelio6470 Жыл бұрын

👏👏👏

@user-ob7ht2ld9b Жыл бұрын

❤

@aadarshverma6913 5 ай бұрын

theon gratjoy

@consoledoterror971 Жыл бұрын

nice refreshing video after a long time. i would say you could have started with hoisting first.

@ServanFICHET Жыл бұрын

Always love your videos but the examples are a bit confusing. I think some people might be lost… Just an honest feedback! Keep the good work! 👍🏼

@developedbyed Жыл бұрын

Oh that’s alright! Which bit did you find confusing? 😊

@ServanFICHET Жыл бұрын

@@developedbyed for example, the part on call stack, web APIs and event loop. I guess it is a bit difficult to understand for a beginner with the examples chosen and Excalidraw. (I know it is not easy to explain and understand visually) Also on the promise, at 18:52, I think you got confused because you called in the user object the attribute “user” instead of “name” and I would have continued in you example instead of fetching jsonplaceholder. For example, you could have created a promise which resolves if user name is “Blanka” but rejects if user name is “Ken” and then illustrates it in the .then.catch chain, and finally use the same example with async await… No offense, I am just providing my view but I might be too picky ;)