Create a Promise4:43 with Guil Hernandez
Learn how to create a promise and get a value out of a fulfilled promise.
Now you're going to learn how to create a promise and get a result out of a promise, 0:00 then how to chain promises together. 0:05 A promise is always going to be in one of three possible states, 0:07 pending, fulfilled, or rejected. 0:11 The pending state is like the waiting state you're in after being handed 0:14 the pager. 0:18 It's the default state of a promise. 0:18 Fulfilled means that the operation completed successfully. 0:21 And rejected means that the operation failed. 0:24 Working with promises is a three step sequence. 0:28 You create a promise instance using the Promise() constructor. 0:31 You then define what should happen when the promise is fulfilled or rejected. 0:35 Then call one of the methods provided by the promise API to either consume 0:40 the value of a fulfilled promise, or provide a rejection reason for 0:44 a rejected promise. 0:49 Let's see how all of this works. 0:50 In the project, open the file promises-breakfast.js. 0:52 In this file, let's create a new promise called breakfast promise 0:56 with const breakfastPromise. 1:01 We create the promise using the new keyword, 1:03 followed by the Promise() constructor function. 1:05 The Promise() constructor takes one argument, 1:10 a callback with two perimeters, resolve for 1:14 when the promise is fulfilled, and reject for when it's rejected. 1:18 Within the callback, I'll write an async task using the setTimeout method. 1:24 I'll pass it a callback and set a delay value of 3,000 milliseconds, or 3 seconds. 1:30 Our Promise() constructor function is all set up. 1:38 This function is going to return a promise object that is either pending, 1:41 resolved, or rejected. 1:46 For example, if I console.log(breakfastPromise), 1:48 then in the terminal run this file with node promises-breakfast.js, 1:53 notice how the console outputs a promise object, which is currently pending. 1:58 And that's correct because pending is the default state of a promise. 2:04 So now, inside the constructor, we can either call resolve to 2:09 return a promise object that is resolved with a given value, or 2:13 reject to return a promise object that is rejected with a given reason. 2:18 Both of these functions are provided by the constructor. 2:23 So first, inside setTimeout, I'll call resolve. 2:26 And resolve does just that, it changes or 2:31 resolves the status of the promise from pending to fulfilled. 2:33 We can pass resolve a value which then becomes the fulfillment value of 2:37 the promise. 2:42 For example, I'll pass resolve the string Your order is ready, come and get it! 2:43 So when the asynchronous task completes successfully, it's going to return 2:51 a resolved promise object with Your order is ready, come and get it as its value. 2:56 Running the file again in the console, 3:01 we see that the promise is in a pending state. 3:04 So now we need to get the value out of the promise object, or consume the promise. 3:06 To do that, the Promise API offers methods you can call on the promise. 3:11 The two you'll likely use most are then() and catch(). 3:16 So first, I'll call then() on our breakfast 3:21 promise with breakfastPromise.then. 3:26 then() can be called to handle both fulfilled and rejected promises. 3:30 It accepts two functions as its argument, one for fulfilled promises, and 3:35 an optional one for rejected promises. 3:40 In this case, I'm only calling it to handle fulfilled promises, and 3:42 later use the catch method to handle rejected promises. 3:45 So to get the resolved value, I'll pass then() an arrow function that takes 3:48 the fulfillment value as a parameter I'll name val, and logs it to the console. 3:54 Now I'll run this file again in the console, 4:03 we see that the promise is pending. 4:06 Then after three seconds, it resolves to the value Your order is ready, come and 4:08 get it. 4:13 Good, so after the three second delay, the promise changes from pending to fulfilled. 4:14 Then the function passed to then() is immediately invoked, 4:21 which returns the fulfillment value. 4:25 In other words, whatever we pass the resolve method is 4:28 available to be used here inside then. 4:33 Not all promises are resolved, so in the next video, 4:36 you'll learn how to handle rejected promises using the catch() method. 4:39
You need to sign up for Treehouse in order to download course files.Sign up