Introduction To Javascript promise

kenneth okenwa — Fri, 17 Jul 2020 00:27:49 +0000

In this article we are going to talk about javascript promise and take a look at some use case and best practices.

In MDN Mozilla Documentation on javascript Promise, Promise is defined as "an object representing the eventual completion or failure of an asynchronous operation.".

What this mean in simple tone is that, Promise in javaScript is an object which can be returned when a task is going on or when a task is complete.

A promise is an object which can be returned when a task is going on and when a task is not happening or done at the same time or speed with other task.

Does that make sense ? Maybe not. So lets get technical with the explanation below.

A promise is an object which can be returned synchronously from a asynchronous function.

A promise is settled if it's not pending, that is, if it has been resolved or rejected. A promise continues to run as long as it have not been rejected.

Three things are mainly involved in a promise, resolve(), reject() and Pending.

You can look at resolve() as a onFulfilled() function which literary means it is fulfilled/completed.

reject() which is self explanatory, when it is rejected.

Pending means it have not been rejected or Fulfilled. You can look at it as seating on the fence, have not made a choice yet.

Sometimes you hear/read people use resolved or settled to actually mean the same thing. Which means it have been completed and not pending.

How about a little exercise to kind of show you how this works?.

   const hold = time => new Promise((resolve) =>
   setTimeout(resolve, time));

   hold(3000).then(() =>

   console.log(' waited then now this');

The hold(3000) call will hold it's chill for 3000ms which is 3 seconds and then prints out "waited then now this". You use the .then() method that is used to pass handlers which can take the resolve or reject value instead of pending.

A standard for promises was defined by the Promise/A+ specification community. There are many implementations which conform to the standard, including the JavaScript standard ECMAScript promises.

Here is another simple example of a promise

let promise = new Promise((resolve, reject) => {

    var a = 10;
    var b = 20;

    if (a < b) {
        resolve('you are correct');
    } else {
        reject('you are wrong');
    }
});

promise.then((message) => {
    console.log('this belong to the resolve ' + message);
}).catch((message) => {
    console.log('and this is rejected ' + message)
});

We defined a new promise that takes two parameter, resolve and reject. Then we create two variables and assign some numbers to each of them. With an if statement to check if true or not, if true the resolve() gets called else the reject() gets called.

promise.then((message) => {
   console.log('this belong to the resolve ' + message);
})

This get's called if the statement is true.

.catch((message) => {
    console.log('and this is rejected ' + message)
});

And this gets called if the statement is false.

Promise in javascript is like promise in real life. You promise something and then you resolve or reject that thing or you catch an error.

I hope this post helps you to understand Promise in javaScript, if so let me know in the comment section below.

if you need help in your web project, or need help with any other Javascript or web development in general, i'm available on Upwork.

How to create Your first Chrome Extension

kenneth okenwa — Wed, 10 Jun 2020 15:50:25 +0000

Chrome extensions are a greate thing to have on your chrome browser.

In this article we are going to create our first chrome extension and install it on our chrome browser.

First lets make a folder that will contain our files.

Countinue reading.....

Front-end to Software Developer

kenneth okenwa — Fri, 15 Feb 2019 10:42:06 +0000

I have been wanting to ask this question guys

Can a front-end developer be referred to as a software developer? And if No, what are the steps to take in moving from front-end to becoming a software developer?

First post

kenneth okenwa — Mon, 15 Oct 2018 22:00:09 +0000

Day1 of #100DaysOfCode going through CSS basics on #freeCodeCamp

I started #100DaysOfCode today! am so excited that I finally started.

will be learning a lot. so far I have solved some programming challenge on #freeCodeCamp

programming is not a new concept for me, I have created some websites with the help of video/online tutorials.

DEV Community: kenneth okenwa

Introduction To Javascript promise

How to create Your first Chrome Extension

Front-end to Software Developer

First post

Day1 of #100DaysOfCode going through CSS basics on #freeCodeCamp