Promises javascript

Estimated reading time: 6 minutes

In JavaScript, a promise is an object that represents the eventual completion (or failure) of an asynchronous operation. Promises provide a simpler way to handle asynchronous operations compared to using callbacks, and they are often used with async/await.

A promise has a few key properties:

  • It represents the result of an asynchronous operation, which can be a success (resolved) or a failure (rejected).
  • It has a then method that allows you to specify callback functions for handling the successful completion or failure of the asynchronous operation.
  • It has a catch method that allows you to specify a callback function for handling any errors that may occur during the asynchronous operation.

promise is alternative of callback . Promise is Asynchronous.

promise has 3 states

  • pending
  • resolve (fullfill / success)
  • reject (not fullfill / error)

create promise

let promise = new Promise((resolve,reject)=>{
  let status = true;
  if(status){
    resolve('data is fetching now');
  }else{
    reject('failed , something missing / error');
  }
});
connectedStatus = (result) => {
  console.log(result)
}
promise.then(connectedStatus).catch(connectedStatus);

chaining promise

let promise = new Promise((resolve,reject) => {
  let status = true;
  if(status){
    let result = 'database is connected';
    resolve(result);
  }else{
    reject('failed , something missing / error');
  }
});

connectedStatus = (result) => {
  console.log(result);
  return new Promise((resolve,reject) => {
    let status = false;
    if(status){
      resolve('data is fetching now');
    }else{
      reject('fetching error');
    }
  })
}
fetchMe = (result) => {
  console.log(result);
}
promise.then(connectedStatus).then(fetchMe).catch(fetchMe);

promise.all

  • wait for all promises until resolve
  • if any reject that time error return
  • return an array
let promise1 = new Promise((resolve,reject) => {
  setTimeout(() => {
    resolve('promise one');
  },5000)
});
let promise2 = new Promise((resolve,reject) => {
  resolve('promise two rejected');
});
let promise3 = new Promise((resolve,reject) => {
  resolve('promise three');
});
let out = (result) => {
  result.forEach((t,index) =>{
    console.log(`index ${index} is = ${t}`);
  })
}
console.log('this is bottom text,  right? aync issue')
Promise.all([promise1, promise2, promise3]).then(result => {out(result)}).catch(out);

// output:
// index 0 is = promise one
// index 1 is = promise two rejected
// index 2 is = promise three

promise.race

  • wait for one promise(less delay) until resolve
  • return promise which delay is short
let promise1 = new Promise((resolve,reject) => {
  setTimeout(() => {
    resolve('promise one');
  },5000)
});
let promise2 = new Promise((resolve,reject) => {
  resolve('promise two');
});
let promise3 = new Promise((resolve,reject) => {
  resolve('promise three');
});
let out = (result) => {
  console.log(result);
}
console.log('this is bottom text,  right? aync issue')
Promise.race([promise1, promise2, promise3]).then(result => {out(result)});

// output:
// promise two
  • test -2
let promise1 = new Promise((resolve,reject) => {
  setTimeout(() => {
    resolve('promise one');
  },5000)
});
let promise2 = new Promise((resolve,reject) => {
  setTimeout(() => {
    resolve('promise two');
  },2000)
});
let promise3 = new Promise((resolve,reject) => {
  setTimeout(() => {
    resolve('promise three');
  },1000)
});
let out = (result) => {
  console.log(result);
}
console.log('this is bottom text,  right? aync issue')
Promise.race([promise1, promise2, promise3]).then(result => {out(result)});

// output :
// promise three

resources

package

video

js