在 Firebase 个函数中顺序链异步函数

Question

In my function I have: 2 global variables, 1 main entry point async function, 1 async function that calls 3 other async functions

export const populateWhatsNew = functions.region('asia-east2').https.onCall((populateWhatsNewData, 
context) => {

//global variables
const interestedPeople: InterestedPerson[] = []
const whatsNewObjects: WhatsNewObject[] = []
//executing the main entry point function
return getTopInterestedPeopleAndTheirData()


//the entry point main function
async function getTopInterestedPeopleAndTheirData() {
  //this function queries multiple documents fromn firestore and adds it to interestedPeople
  //then calls an async function
  async getTheData(interestedPeople)
}


async function getTheData(theInterestedPeople: InterestedPerson[]) {
  //I want these 3 tasks in the array to be executed sequentially but
  //the order is mixed
  const tasks = [
    getCompsReceived(theInterestedPeople),
    getTheLatestInsights(theInterestedPeople),
    checkIfWhatsNewObjectsAreSufficient()
  ]

  for await (const task of tasks) {
    return task
  }

}

async function getCompsReceived(theInterestedPeople: InterestedPerson[]) {
  //queries documents from firestore and pushes it to whatsNewObjects
}

async function getTheLatestInsights(theInterestedPeople: InterestedPerson[]) {
  //queries documents from firestore and pushes it to whatsNewObjects
  theInterestedPeople.forEach(async (person) => { 
  //loop through each array to get some data
  }
}

async function checkIfWhatsNewObjectsAreSufficient() {
  //just checks the length whatsNewObjects and if less than 80 re runs the loop
  //else adds this the data in the array to firestore and then calls
  if ( whatsNewObjects.lenth > 80 ) {
    //pushes all the data in whatsNewObjects to Firestore and then
    //calls another async function
    await incrementsTheTotalNoItemsAndUnReadItems()
  }
}

async function incrementsTheTotalNoItemsAndUnReadItems() {
  //increments some number fields in firestore by the 
  //length of the WhatsNewObjectsLength
  }

})

So I want the functions to be executed sequentially. But I have noticed the order of the functions is mixed. How do I achieve sequential execution of the 3 functions in the get the data() method

Answer 1

So, The syntax that I used was actually correct, the problem was in the body of the async function getTheLatestInsights(theInterestedPeople: InterestedPerson[]) There is a gotcha for using async functions in typescript where in the following syntax used to loop through an array inside an async function:

  theInterestedPeople.forEach(async (person) => { 
    //loop through each array to get some data
  }

Doesn't actually work, so the function would basically skip the entire loop(but execute it a little later). So if we want the function to wait till this entire loop is completed before proceeding to the remaining part of the function body then we have to use this syntax:

for (const person of theInterestedPeople) {
    //loop through each array to get some data
}

Answer 2

In order to make sure that your async/await you need to use promises in order to handle the flow of the code.

What promises do is allowing you to control to execute a sequence of asynchronous tasks to be performed one after another.

Example of Promise chaining:

new Promise(function(resolve, reject) {

  setTimeout(() => resolve(1), 1000); // (*)

}).then(function(result) { // (**)

  alert(result); // 1
  return result * 2;

}).then(function(result) { // (***)

  alert(result); // 2
  return result * 2;

}).then(function(result) {

  alert(result); // 4
  return result * 2;

});

Please keep in mind that this is not the only way of chaining promises. You may find more information in the documentation about " Promises chaining ".