How to create a new Promise in JavaScript?

This video covers how to create a new Promise in javaScript. To learn about what are Promise and its states, check out Promise and States video.

Code

// Create and return a resolved Promise
let p = new Promise((resolve, reject) => {
    // Perform async computation
    resolve("Here is resulting data")
})

// Create and return a rejected Promise
let p = new Promise((resolve, reject) => {
    // Perform async computation
    reject('The operation failed due to timeout')
}

// Creating promise using Promise.resolve
let p = Promise.resolve('Creates a new Promise with resulting value')
p.then(data => {
    console.log(data)
})

// Creating promise using Promise.reject
let p = Promise.reject('Creates new Promise containing error')
p.catch(err => {
    console.log(err)
})

Full Transcript

0:00 Hi there. Welcome to the JavaScript series and I'm Deeksha Sharma from bonsaiilabs. In the last video, we covered what a promise in JavaScript and the States of promise. This video covers how to create a new promise. So if you would like to do a quick refresh on what a promise is, the link is in the description below. Okay, how do I create a promise? Let's find out. There are a couple of ways you can create a promise. We create by calling a new keyword on promise. The input arguments to this promise constructor is a function. This function takes two arguments, a resolve and a reject. Inside this function, we could perform the asynchronous computation. Now wrap and return the result of that computation into this resolve function. We use resolve if the computation was a success and there are results that we need to store in the promise object.

0:53 And finally we store this promise object into a variable called p. Now what if the computation failed? Well, if that is the case, we can wrap and return the error of that computation into this reject function. We use reject, if the computation was an error and need to store the reason of failure in the promise object. Now another way to create a promise is by calling promise.resolve function, which returns a promise object that is already resolved. This return promise will be fulfilled with the value pass to it. Whereas in this previous approach, the promise will be pending if an async computation is not yet completed and it'll only give us this result after the execution is finished. Similarly, promise.reject will return a promise that is rejected and the value is the reason of rejection. Again, the difference is, the first promise will immediately give us this resulting value, whereas here, the resulting reason of error will only be available eventually after the computation is finished and it results in failure.

2:00 Okay, so now you might be wondering, how do I get the results from the promise? After all, the purpose of promise was to get the results eventually. How does it help? To get the value from a fulfilled promise, you start with the then method on the promise and provide a handler. This handler takes one argument which receives the eventual result from the computation. Considering the same example we looked at, the data here will be the message. Then in the body we could do anything with data. In this example we are just printing it on the console. Also remember .then method returns a new promise that either resolves with a returned value or is resolved with an undefined value like in this case since we are simply logging the data on the console. Now when it comes to handling of value from the rejected promise, we call the catch method on the promise.

2:50 The handler takes one argument which receives the eventual error from the asynchronous computation. Considering our previous example, the first thing you will observe is that instead of resolve, we are using reject to reject the promise. Then we have this text which will become the value of error inside the handler. Now again, inside the body we are just printing it on the console, but we can handle errors the way we want. Alright, so now you know how to create a promise and get the results from it. That's all I wanted to cover in this video. If it was helpful, then be sure to subscribe and until then my friends keep learning and share your knowledge. I'll see you next time.