⚠️ This lesson is retired and might contain outdated information.

Simplify Asynchronous Callback Functions using async/await

Share this video with your friends

Send Tweet
Published 6 years ago
Updated 6 months ago

Learn how to write a promise based delay function and then use it in async await to see how much it simplifies code over setTimeout.

Lets say you want to call a function after 1s, 2s, 3s. You can use setTimeout, or you can wrap it up into a simple delay function that works with async/await

[00:01] Here, we have run function that takes a callback, and calls it using setTimout after one seconds. We can then repeat this pattern for calling a callback after two seconds, and then three seconds. Our runner is now complete. We can use this runner to run a callback that simply logs the time to the console.

[00:23] If you run this code now, you can see that it follows the specification correctly in that the callback is called after one second, two seconds, and then, three seconds. Even though it does satisfy a requirement, you can see that the setTimeout nesting in a run function adds a lot of noise that makes the intent slightly difficult to figure out.

[00:42] We can make this much easier async/await. The only thing we need is a Promise space delay function, and it is very easy to write. It simply takes a number of milliseconds, and returns a Promise that gets resolved using setTimeout after the given number of milliseconds. That is it.

[01:01] Now, we can create a runAsync function which is now an async function which is going to still take the callback like before, but inside the function, we now get to use await to pause function execution till the Promise is resolved, and then, we call the callback passing in the time.

[01:21] Now, we can duplicate this code by simply changing the arguments to the callback. Now, if you copy over the previous call to run, and this time call runAsync, if you go ahead and execute the foo, you can see that it still behaves the same in that the callback is called after one second, two seconds, and then three seconds.

[01:42] This time, the code is much simpler, thanks to our Promise based tele-function and async/await.

~ 5 years ago

Hi,Basarat Ali Syed

What is your demo extension used in the video?

Awesome course by the way! thanks!