Callback Functions in JS ft. Event Listeners 🔥| Namaste JavaScript Ep. 14
What are Callback Functions in JavaScript? How does Event Listeners work? What does Blocking the Main thread means? This tutorial video answers all your doubts about Callbacks with proper code examples and demo using the developer tools in the browser.
This video covers in depth about Callbacks, Advantages of using Callback functions. This knowledge will be very helpful for understanding the Event Loop and how JavaScripts works asynchronously.
The only request is to watch this Episode of Namaste JavaScript with full attention. 🙏
My tech gear I use every day - google.peek.link/2pba
Timestamps:
00:00 - Introduction
00:55 - What is a Callback Function in JavaScript?
01:20 - Advantages of Callback
06:21 - Callback - dev tools Demo in browser
08:18 - Blocking Main Thread in JavaScript
10:18 - Creating an Event Listeners in JavaScript
13:30 - Closures along with Event Listeners
19:25 - Garbage Collection & remove Event Listeners
21:59 - Teaser of the next video
22:43 - Thank you for watching Namaste JavaScript 🙏
Support this video series, NOT BY MONEY, but by sharing it with your friends. 🙏
I'll give my best to come up with great content and everything absolutely for free on KZread. 😊
If you are active on Social Media,
please give a shoutout to Namaste JavaScript and help me reach more people. 🙏
Cheers,
Akshay Saini
akshaysaini.in
Would love to Stay Connected with you ❤️
LinkedIn - / akshaymarch7
Instagram - / akshaymarch7
Twitter - / akshaymarch7
Facebook - / akshaymarch7
#NamasteJS #AkshaySaini
Пікірлер: 945
cleared 12 LPA package interviews having just 1 year exp. just because of you brother . Hats off
@mrityunjaysharma
3 жыл бұрын
Hii i have learnt HTML, CSS, data structure and Algorithm now learning JAVASCRIPT. Can you suggest me what should i learn after this?? And how to apply for a job??
@mohammadmuzmilkabir3067
Жыл бұрын
What was your previous package that you got so much hike ?
@heathens2867
Жыл бұрын
Tech stack and company??
@Adityasongs1
Жыл бұрын
@@mrityunjaysharma learn Node Js for backend With express Js, And Learn React and Next js For Front end you can Go with Angular Just see whats the demand in market or whats suitable for you nowadays react is popular and there is demand. s Angular most of the cases pays more salary then cause its little more diffuclt. ....Then Leaen Intermediate level of CI CD Git and github...All set..!
@evil6270
Жыл бұрын
@@mrityunjaysharma after learning that what u doing now bro i going same like u now, u got jobs and what u did help me out
Things learned: 1. Function that is passed on as argument to another function is called callback function. 2. setTimeout helps turn JS which is sinhlethreaded and synchronous into asynchronous. 3. Event listeners can also invoke closures with scope. 4. Event listeners consume a lot of memory which can potentially slow down the website therefore it is good practice to remove if it is not used.
@chethanprabhu4475
Жыл бұрын
setTimeout does not help to convert from sync to async. setTimeout itself is async operation. He used it to mock a api call.
@jagrutsharma9150
Жыл бұрын
@@chethanprabhu4475 Thanks for telling
@a-mohdarif1597
Жыл бұрын
@@chethanprabhu4475 callback provide the power of async to setTimeout
@imaginecodes2382
Жыл бұрын
@@jagrutsharma9150 you can edit your comment
@The-Great-Brindian
Жыл бұрын
ah setTimeout. My favorite function in JS 🙂
my colleague from USA showed me this playlist, can see how much people learn from you, love you man you made my life so easy
@abhishekkashyap8856
2 жыл бұрын
May I know the clg name or you lying to promote this channel?
@rajatsawarkar
2 жыл бұрын
@@abhishekkashyap8856 i don't need to prove you anything, stop being a Beta male you poor thing 🤣
@programming3043
2 жыл бұрын
Chal jhutey
@AryanGNU
Жыл бұрын
@@abhishekkashyap8856 kaha se laate ho hate bhai ? Agar channel nahi pasand to mat dekho but hate mat failao
@abhishekkashyap8856
Жыл бұрын
@@AryanGNU aisi kon si hate fala di maine. Ye chutiyapa hum se nahi dekha jata. Real life scenario alag hote hai
How was this video? Let me know in the comments below, I read each and every comment! ❤️ Next Video: EVENT LOOP & Asynchronous JS 🔥 - kzread.info/dash/bejne/aq5_17CoZMTfaKg.html
@arunlachheta8804
3 жыл бұрын
Waiting new one after event loop
@kavyashree7923
3 жыл бұрын
It is a visual treat to see how javascript works on the dev tools.
@kishorsharma1976
3 жыл бұрын
Great video 🙏
@deepanshu247
3 жыл бұрын
Not only this one, but each of your video is very helpful Akshay. Also please accept my LinkedIn request :D
@hendrylawrence2175
3 жыл бұрын
Bro just tell me how to get a job after I learned this thing
Happiness is when I actually do remember previous concepts when Akshay asks remember, remember.... remeeeeember :D . Long live Javascript and Akshay.
@akashsingh-ch5xc
3 жыл бұрын
Same Pinch :)
Watching the whole Namaste JavaScript tutorials in sequence , its a beautiful tutorial. You have done really very good R&D to make each videos. Thanks for such a beautiful and useful tutorial.
This is the best series for JavaScript ever! I haven't come across any other video media which covers these topics in such depth. You rule man!!
I liked the part where you used devtool to show how callback works. It's like proving the theory through practice. I am waiting for the videos on the event loop.
@akshaymarch7
3 жыл бұрын
I would suggest you to play in your devtools, it's super fun to see things working! ❤️
@samyever2be
3 ай бұрын
@@akshaymarch7 Can made one video about your Namaste react., I am new for frontend
Brother, you are amazing!!! I can't wait to learn Event Loops from you. Although I already have a quite clear idea of it still I feel like your teaching it will be next-level enlightenment. Kudos to you, man!
watching your videos is like watching my favorite tv shows, I just can't stop. Thanks Akshay! You have so much talent in expressing things clearly!
The effort from you to explain things with so much perfection is so real. Fortunate to find your channel on KZread :)
You're great man. Clear. Energetic and knowledgeable. All the best qualities of an instructor. Thank you!
Yes, waiting for event loop, All your videos are like connecting missing link while learning JavaScript. Really appreciate your efforts and thanks
@Akshay I'm working as Web Developer from one year, I have struggled so much to understand these basic concepts. I have referred to many courses in udemy with 50 hours+ lectures, but none explained this way. Like a Netflix series I got addicted to your explanations and I think I will never forget these concepts in my entire life!! Thanks a lot Akshay, I kindly request please make more videos like this just in JavaScript!! I will recommend only 'Namaste JavaScript' to everyone from now on!! May God bless you! Thanks for all your help!☺
@raj-pl8xz
10 ай бұрын
hello angel..give yur num
This was yet another insane video. You really make sure we REMEMBER the concepts taught back. Just awaiting for next Event Loop video. ♥️💯
It was brilliant to watch the whole set of Namaste JS tutorials and this has given me a lot of confidence as a developer. Akshay has just lit this journey by explaining concepts by coding and in real time, which I wonder no tutorials would do. Just waiting for your upcoming videos and until then I shall play around with JS !!😉😁
This series is really helping me to clear my all Javascript concepts
Your Video Lectures are really really helpful, the way you have explained "Closures", ''Callbacks", "Call Stack and How Synchronous and Asynchronous Thread Executes" everything is top class.
You are the first one I'd watch his long videos without being bored or blinking.
Understood callback in great detail 😊. First example explained with stack built solid foundation & made easy to understand rest. Very excited for event loop. Thank you 😊
Your efforts in every video never go in vain. To see everything in the dev tools is just amazing. Its like seeing what's going on under the hood and it does make everything crystal clear. Keep explaining like this 😍😍 .... waiting for the event loop video 🌸✨🙌💁 Thank you for all your efforts!! 😇
this concept of explaining everything through dev tools is awesooooome.
The way you explain things, I found it very easy to understand. Thanks for this tutorial. Hope to see more!!
The explanation of Devtools was just superb, mind blowing and extra-ordinary!!.. Now Event listeners will never get detached from our HEAD.. 😋😋😋
After watching this series, I Can confidently say that I know JavaScript. Thank you Akshay, you are great 🙏
beautifully and masterfully explained my friend, probably one of the best explanations on all these concepts rolled into one video - great job. I'd wager this video has helped hundreds of thousands of trainee devs in solidifying their understanding on the aforementioned concepts.
your explanation is very crystal clear. and the way you demonstrate in devtool is simply to the point. Thank you.
Thankyou so much! I'm noting it all down, making notes so as to revise them in future ! Can't believe this content is free !!
@akshaymarch7
3 жыл бұрын
Fantastic, that's exactly my way of learning! 🔥
@mohit96nain
3 жыл бұрын
Is it possible for you to you share your notes. I would really appreciate your efforts and dedication. Thank you in advance 😇😇 my email: mohit96nain@gmail.com
@shruthib3366
3 жыл бұрын
I would love to refer to those notes Reeti. Could you please share it to shruthibabu2018@gmail.com Thank you so much!
@krunalumak6838
3 жыл бұрын
Same here Reeti, I would like to read your notes for interview reference. Please send them to krunalumak25@gmail.com Or we can have a google doc, interested people can add notes there
@himanshusingh694
3 жыл бұрын
Can you please add them in Google docs and add us?
Please never stop creating content. I watch all of your ads and tell all of my colleagues about you... just to support your channel.
This is my second time going through the whole playlist, it's still gold
Very Excited for the event loop video. The dev tools explanation is the best since we don’t have to guess what would be happening but we can see exactly what’s happening.
Don't skip ads on such a true quality content.
So, Akshay looking for a bride In which language do you code? She: C++ Akshay: Hmmmm She(2): Java Akshay: Hmmmm She(3) :Python Akshay: get out She(4): Javascript Akshay: Maaaaaaaaa Bahu mil gayiiiiii
@akshaymarch7
3 жыл бұрын
Hahaha, this gave me a good laugh!! ❤️
@akshayhere
3 жыл бұрын
Lol. Always better to be language agnostic
@abhijiths148
2 жыл бұрын
Well after marriage she will get double the Salary. ;)
@urvishagreat
2 жыл бұрын
Main criteria ... She should know JavaScript. 😁
@pavanvidyasagar905
2 жыл бұрын
@@urvishagreat she'll learn from Namaste 🙏 JavaScript series 😁
Excellent explanation. Didn't see this type of deep explanation with the actual working with example before in any paid courses which this guy is providing free of cost 🔥🔥
This is the best explanation of callback i ever saw!!! really like the way you explain complex concepts in a easy way
Yes Brother , we understand it very well and in practical way , thanks for this kind of deep dive to the topic + interview question explanation, even i was asked this question in interview too.
really boosting my confidence with every video..
Man you are really one of the best tutor I have ever come across🙏🙏🙏 Anything in JavaScript if I'm not able to understand... I just simply watch your video and it really gets embedded into my head. Nice work bro👍🏻👍🏻
This series is the best KT session I have ever attended. Thank you so much for all these videos.
I think after watching all your videos, I can crack all interview of my dreams company #apple #Facebook #Microsoft #Google ...these 5 company is my dream..... great learning stuff's
I wish I had a teacher like you in my graduations😣 but koi baat ni der aae durust aae😄 beautifully explained😊 thank you so much🙏
All videos till now going Mind Blowing.... Best Ever way of teaching!
You teach the concepts so well. I like the way you keep linking one concept to another like execution context to call stack and call stack to closures. This not only helps me to better understand the new topic but also helps me in remembering the previous ones. It really requires a lot of hard work to make videos with such amazing content along with your job. A big fan of you sir ❤🙏
This is a really good series. Learning some new things! Namaste :D
It's a Treat to watch and learn from you.
I am super excited for the event loop video. Great efforts Akshay. Every week I eagerly check for your channel for your videos. Thank you for your contribution to js community.👍
You are doing an amazing job of explaining behind the scene. Thanks so much for teaching in depth
I have been studying js for past 4 months... Thought I know js... But after seeing ur namste js series.. I think I am just a noob and donkey in js... I think I have to postpone or give up my interveiw which is on next Friday.. Throttling debouncing execution context etc.. I never heard about this in the KZread tutorial which I prefer...ur doing a great job.. Just keep posting it regularly.. Has ur videos can only make many students placed ...
I've completed my master's in mechanical engineering, and after that, I planned to switch my career in the IT industry. Yesterday, I cracked the first round of interviews for the position of front-end developer. All the questions on JS were from your videos, and I can bet that the interviewer has also watched your Namaste Javascript series.
@mdfarhan2047
5 ай бұрын
Bro how's your corporate Life going... I'm from civil background...can you tell me how many experience years you have now and how to get into it company..plz share your experience? Where are you now?
Whenever i see functions, I just love playing with them, Thanks to you.
Best drum roll I've heard! Thank you for the TOP quality videos, they really help.
Akshay , your videos are really helpful , thank you for sharing these with us and waiting for more. And one request , could you please create a video on callback hell and (call , apply , bind) methods of JS.
@akshaymarch7
3 жыл бұрын
Call Apply Bind video is already there on my channel. Please check out the other playlist. 🕺
Very good video on call back function () ..can we get a video on callback() vs promises() vs asyn await () please
Really I have not seen such a practical,indepth n end to end explanation except Namasthe javascript series.........I wish to gain more and more knowledge from you
I do appreciate the way, you explain the dev tool in depth
what is a call back function in java script ? we already know that function are first class citizens in JavaScript. that means we can take a function and pass it to another function. when we a pass a function to another function, whatever the function that we are passing as an argument that we call it as call back function. Example:- function x(y) { console.log("x"); y(); } x(function y() { console.log("y"); }); in the above example function y is the call back function to the function x. in the above example it is up to function x on when it wants to execute function y, means in the code function y will get called by function x after some time, that’s the reason we got the naming convention as call back function , these function will get called after a while back. setTimeout(function a() { console.log("Hi") }, 5000) in the above example function a() is the call back function to the function setTimeout. these call back functions are very powerful in JavaScript. it gives us access to the whole asynchronous world in a synchronous single threaded language. JavaScript is a synchronous single threaded language. That means it can do one thing at a time in a single order. but using call backs we can do asynchronous operation in JavaScript. for example if any function or operation takes lot of time (may be 20 to 30 seconds), and if we try to execute this function using main thread (JavaScript has only one main thread), then the JavaScript won’t be able to do any other things in these 20 to 30 seconds. we should never block our main thread. that’s the reason we should always try to choose async operation which takes time. without the concept of call back function we won’t be able to achieve async operation in JavaScript.
Please Akshay sir please continue this series. It's been 1 year please sir continue it 🙏🏻🙏🏻
It's not only event loop video, I am always excited for any of your video Akshay. Thanks for clearing out the concepts one more time. 🙏♥️
Your excitement of teaching is the motivation.
Now youll get us out from callback hell. I have faith in you 🥳🥳🥳
@gopinatha.p3194
3 жыл бұрын
Akshay will give you a promise 😂
@ahmadhabib4564
3 жыл бұрын
I see what you did there
Word Wrap setting in Visual Studio Code might be helpful for you.
Mind blown by javascript, only because you explain in easy way!
You are just awesome bro... The way you explain the concept I have never seen in any tutorial so far... Thank you so much.
I needed this in reactjs closures behaviour is very different than used useCallback hook to solve this issue of denouncing bcoz needed to implement the denouncing but was unable to implement directly in React js🙏
@akshaymarch7
3 жыл бұрын
Why don't you try to code it yourself, a great opportunity brother.!
@nitin0001
3 жыл бұрын
@@akshaymarch7 i tried but for every render it create new instance of that closure function to keep reference to same function for every render i need to use useRef or useCallback hook
Life has so many questions. But one of the most important question that we all should ask is ! 20:12
Just wondering where I'd have been if you were my Web Dev lecturer in college! Thanks a lot for this series, Akshay! I'll always be grateful to you! And I'm excited to watch your video about Event Loop 🎊
Thanks Akshay. This video is awesome. The way you demonstrate all the concepts of callback, closure, event listeners, and data privacy in the dev tool is really amazing. Now I am feeling more comfortable and confident on these topics. Thank you !!
How does the eventListener on Js File and Inline html onClick event differs? Do they differ on Garbage collections?
@akshaymarch7
3 жыл бұрын
Wow, amazing question. I would suggest you to open your devtools and try it out. Try to find out yourself, it will be super fun. ❤️💥
@baibhavkumar6031
3 жыл бұрын
This is a very good question, I found this stack overflow link helpful. Posting it here so that others can get some info as well stackoverflow.com/questions/6348494/addeventlistener-vs-onclick
@frank3481
3 жыл бұрын
@@baibhavkumar6031 love this article. thanks
who are these people who give thumbs down ? Just Curious.
@krunalumak6838
3 жыл бұрын
Probably they are Antiscripts(Antichrists)
@siddharthsingh7341
2 жыл бұрын
Might be other JS channel people who come, learn, steal ideas and concepts and dislike...lol :)
this is a very rare series in javascript and a good opportunity for our beginners thank you Akshay bro
Before this video, I don't know how eventlisteners work. But now, I know event listeners and their work. Thank you. And I am so excited about upcoming videos.
When dealing with deeply nested async functions, I sometimes run into maximum call stack exceeded error. I read that async functions need to end with a return statement but still sometimes I end up with this issue. Appreciate if you could make a video on how to properly handle async functions to avoid this error. Thank you. This is a great video nonetheless.
The way to explain concepts is superb. This Javascript series is really helpful for us
One day i just randomly texted a guy on discord and straight way he suggested your video playlist. As a beginner i should say that no one had made me this clear and by clear i mean crystal thanks Akshay ❤️🙏
It really worked for me after I look and try some tutorials, yours is the one that worked. Owe you a lot.
your all videos are really helpful and answering lots of doubts.
One of best videos out there to learn. He absolutely makes it easy.
I searched the entire internet universe to find a perfect explanation and found it here. Thanks.
The best content out there for js. Hands-down.
Thank you so much for explaining this concept in this video! My sir (teacher in a coding institute) recommended this course. And I came here just to revise callback functions but now I know much more than that! Thanks again, sir!
Thank full 🙏 JavaScript depth series. Because many step are make easy watching this series. All interview questions is solve. My life make easy So lot of thanks 🙏🙏 Akshay Sir.
Can't for wait for event loop video. Let them keep coming really enjoying this series
Thanks for such an amazing videos. You explains it very well. I started watching your videos, you make it more interesting, suspicious and put clarity. Earlier every time I used to end up watching unnecessary videos when I opens up KZread. Thanks Akshay.
No matter what every time i learn something from you even though i know the concept.
Best explanations and the devtools explanations are sweetest add ons .Thanks a lot .
Best explanation. Theory + practical. Everything is so clear now. Just awesome. 👏
Bundle of thanks, unbelievable you are a genius.
Yess, I am very much excited. And the dev tools explanation are really helpful. you make the things so easy to grasp
Presentation feels very friendly Feels like a friend talking about js,
You are awesome man, super enthusiastic person.. love the way you pour your heart while teaching us ❤ All the best 👍
Very informative video! I now, don't have to rely upon a lot of resources and get confused. So, your channel acts as an one step solution for problems dealing with JS.
after watching your javascript playlist , I feel very confident in js 🦾🦾, thanku ❤
yes i did understand and i was blown away by dev tools explanation as well havent seen them anywhere else
All the concepts I learned here are really helpful and looking forward to the event loop videos :)
I am so thankful to have found your videos !! You are the best teach ever , so much knowledge and your passion for JS makes me want to learn the hell out of javascript 🔥🔥🔥🔥
Eske liye aapko Tamra ptra diya jayega 26 Jan ko :) jo Amrish puri ko mila tha desh ki aajadi ki ladayi me ...... One of the best JS playlist on KZread....Love you
Mostly I don't comment on videos, but your teaching style is just ❤️, I understood each and every concept, thanks for making these tutorials, and hat's off to you for all this work
Thank U, got some relief watching you today.
yeah, I understood it sir. Finally got the air around callbacks.
You are very talented and enthusiastic about teaching JS.the way you explain is very convenient and easy to understood. Thanks for teaching us. Please keep it up.