CODEWITHSUNDEEP
javascriptecmascript-6
Nidhin Kumar
Nidhin Kumar

Reputation: 3579

How to do async process for multiple functions with loops in each functions

I have four functions in which each function has a loop inside it. Based on the completion of the first function loop the second function should be called and completion of second functions loop should call the third function.

I have used async and await but it didn't work.

Can anyone tell me what is wrong in my code?

First Function:

selectedUser = (userName, userId) => {
  this.isFilterByNameSelected = true;
  this.props.dispatch(fetchDuesChitties()).then((datas) => {
    Object.keys(datas).map((key) => {
      if (datas[key].chittieUsers) {
        let chittieUsers = datas[key].chittieUsers;
        Object.keys(chittieUsers).map((userKey) => {
          if (chittieUsers[userKey].userId === userId) {
            this.userTicketNumber[key] = {
              name: userName,
              chitId: datas[key].chitId,
              chittieId: key,
              chitName: datas[key].chitName,
              chittieName: datas[key].chittyName,
              auctionsCompleted: datas[key].auctionsCompleted,
              userId: userKey
            };
          }
        });
      }
    });
    this.getChittiePayment();
  });
};

Second Function: 

 getChittiePayment = () => {
  Object.keys(this.userTicketNumber).map((key) => {
    let totalAmount = 0;
    let auctionsCompleted = this.userTicketNumber[key].auctionsCompleted;
    let chitId = this.userTicketNumber[key].chitId;
    let paymentDetails = this.props.chits[chitId].paymentDetails;
    for (var i = 0; i < auctionsCompleted; i++) {
      totalAmount += parseInt(paymentDetails[i].dueAmount);
    }
    this.userTicketNumber[key].totalAmount = totalAmount;
  });
  this.getUsersDuePayment();
}

Third Function:

getUsersDuePayment = () => {
  Object.keys(this.userTicketNumber).map((key) => {
    let customerId = this.userTicketNumber[key].userId;
    let auctionsCompleted = this.userTicketNumber[key].auctionsCompleted;
    this.props.dispatch(fetchPaymentsByUserId(customerId, auctionsCompleted)).then((payments) => {
      this.userTicketNumber[key].amountPaid = payments;
    });
  });
  this.getBalanceAmount();
}

Fourth Function:

getBalanceAmount = () => {
  Object.keys(this.userTicketNumber).map((key) => {
    let userKey = this.userTicketNumber[key];
    if (userKey.totalAmount && userKey.amountPaid) {
      let balanceAmount = userKey.totalAmount - userKey.amountPaid;
      this.userTicketNumber[key].pendingAmount = balanceAmount;
    }
  });
  this.setState({ userFilter: this.userTicketNumber });
}

Upvotes: 1

Views: 48

Answers (1)

R.Sarkar
R.Sarkar

Reputation: 354

You have to return a promise from second and third function in order to get this work. Try below example. Hope this will help you.

async function First(){
 console.log('Firts Func started');
 await Second();
 console.log('End');
}
function Second(){
  return new Promise(async (resolve,reject)=>{
  console.log('At Second Function');
  await Third();
  console.log('Second func end');
  resolve('Data From Second function');
 });
}
function Third(){
 return new Promise(async (resolve,reject)=>{
 console.log('At Third Function');
 await Fourth();
 console.log('Thidr func end');
 resolve('Data From Third function');
});
}
function Fourth(){
   return new Promise((resolve,reject)=>{
   console.log('At Fourth Function');
   console.log('Fourth func end');
   resolve('Data From Fourth function');
  });
}
First();

Upvotes: 1

Related Questions