Check out a free preview of the full Interviewing for Front-End Engineers course

The "Promises Exercise" Lesson is part of the full, Interviewing for Front-End Engineers course featured in this preview video. Here's what you'd learn in this lesson:

Students are instructed to work on the promises exercise. Jem also talks about promises, and why it is important to understand them over simply relying on async await.


Transcript from the "Promises Exercise" Lesson

>> Promises, what do we know about promises? I actually have a good quote that I stole from MDN, my favorite website. What is my quote? What do we know about promises? Someone tell me something.
>> Someting that will return with a future value.
>> Yeah, I like that.

I'll use the MDN definition because it's much better than anything I can say. I can say a promise is a proxy for value that's not necessarily known when the promise is created. Which a promise is, it's exactly that, it's a promise to return something eventually. You don't know what.

You don't know where or when, but you know what happens eventually, so we program around that. The old style of handling values that we don't know what it's gonna be, but we know we want it to return eventually would be using old school callbacks. So in a callback you invoke a function, it does some work and then whenever it's done, it calls back the function to pass on that value or do whatever you wanna do.

With the invention of promises, we can now chain things together and I don't have to explicitly call the callback every single time. We can just chain this together. Hopefully, not hopefully, at this stage in JavaScript engineering or UI engineering you should probably know what promises are. You know them in a much cleaner way as async await.

But you still need promises, you still need to understand how they work because a lot of code, especially old node libraries, they don't use async await. They use callbacks. So you need to know how promises work to wrap a callback with a promise and then return that. Async await is pretty.

It's a much prettier syntax. If you can't tell, you can just await something and eventually it gives you that value versus callback. And then you ever seen the Flying V of doom? Where you have callbacks and callbacks and callbacks because this will be a callback, and this will be a callback and this will be your callback.

Async await solves all of that. Much prettier. So I have two questions, we have two questions left. And I won't give you a promise phi one. I'll leave that in the advanced section. So I have one question, which the original, the harder question is, given a function that looks like this, how would I convert that into a promise?

I pass this and then convert it to a promise, it's more challenging than you think. Give it a shot sometime, the answers are of course in the answer section, but we'll do a shorter one, sleep function. Now implicitly if I say sleep to the JavaScript, what are you thinking?

>> Thread sleep.
>> Yeah, but can we do that in JavaScript? No, we can't. Exactly, you'd be like, Gem, you handsome fool. You can't sleep in JavaScript, it' single threaded, it just runs and runs, the best you can do to stop a thread would be an infinite loop.

And then it just locks up the entire thing. So we can't necessarily sleep in the main thread, but I can sleep in a function. As in using await or something along those lines I can make this function wait here for a specified interval of time and adjust a function, I couldn't do this on the global scope or anything like that.

So using this, this is the last problem. Create a sleep function that takes one parameter, which is time, and we'll wait time milliseconds. I even graciously gave you an example, which you would not get in real life probably. So sleep, it's gonna wait 500 milliseconds then it's gonna print hello and then it's gonna wait 500 milliseconds and print hello.

And I'll give you ten minutes on this one. This is the last problem for the day then you've made it. And hopefully I've simulated real life exhaustion that you'd get [LAUGH] in a tactical interview.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now