在异步函数中使用While循环？

Question

I'm trying to use a while loop inside an async function, and I suspect my resolve(); is messing up the loop, but I'm not sure what to do about it. Here's the code I have:

app.get("/meal-plan", async function(req, res) {
    var calorieCount = req.query.calorieCount;
    var mealInput = parseInt(req.query.mealInput);
    var dietInput = req.query.food;
    var goalPerMeal = (calorieCount / mealInput);
    var whichDiet = "diet." + dietInput;

    var breakfastGoal = goalPerMeal;

    var breakfastArr = [];

    async function getBreakfastArr() {
        return new Promise((resolve, reject) => {
            var breakfastQuery = {"breakfast": true, [whichDiet]: true};

            while (breakfastGoal >= 150) {
                Food.count(breakfastQuery, function(err, count) {
                    if (err) {
                        console.log(err);
                    } else {
                        var random = Math.floor(Math.random() * count);

                        Food.findOne(breakfastQuery).skip(random).exec(
                            function(err, result) {
                                if (err) {
                                    console.log(err);
                                } else {
                                    breakfastGoal -= result.nutrition.calories;
                                    breakfastArr.push(result);
                                    resolve();
                                }
                             });
                    }
                })
            }
        });
    }

    try {
        await getBreakfastArr();
        console.log(breakfastArr);

        res.render("meal-plan.ejs", { meal: mealInput, calories: calorieCount, diet: dietInput, breakfast: breakfast, lunch: lunch, dinner: dinner, totalCalories: totalCalories});

    } catch (e) {
        res.json(e);
    }
});    

The goalPerMeal variable takes a user calorie input and divides it by the number of meals they select on my form. I then set that value to a specific breakfast variable called breakfastGoal . The async function finds a random recipe from my database and adds it to my array, breakfastArr . Once it finds the recipe, it subtracts that recipe's calorie count from the breakfastGoal .

I want this function to run until breakfastGoa l is reduced to below 150; however, it doesn't seem to work. If I remove the while loop, the function will successfully find the breakfast item, add it to the array, and subtract its calorie count from breakfastGoal . The only thing breaking it is adding the while loop.

Is this something to do with the resolve(); in the async function, or am I missing something important?

Any help is extremely appreciated.

Answer 1

Do you think something like this will work? I have not tested this. Just an idea. put the while block inside the else block and call recursively.

async function getBreakfastArr() {
  let breakfastQuery = { "breakfast": true, [whichDiet]: true };
  return this.getRandomRecipe(breakfastQuery).then((response)=>{
        return response; //the response will have your breakfast goal
  });
}


async function getRandomRecipe(breakfastQuery) {

   return Food.count(breakfastQuery, function (err, count) {
    if (err) {
      console.log(err);
    } else {
      var random = Math.floor(Math.random() * count);
      Food.findOne(breakfastQuery).skip(random).exec(
        function (err, result) {
          if (err) {
            console.log(err);
          } else {
            breakfastGoal -= result.nutrition.calories;
            breakfastArr.push(result);
            while (breakfastGoal >= 150) {
               this.getRandomRecipe(breakfastQuery);
            }
            return Promise.resolve(breakfastGoal);
          }
        });
    }
  })
}

Answer 2

The problem is that you create only one promise, but have several asynchronous results you need to wait for in the while loop.

The first time resolve is called, that sole promise is resolved, and that will make the code following the await to execute. But at that time your array is not finished at all. Also, any further calls to resolve will not influence that promise any more: a promise can only be resolved once. The other calls are ignored.

The solution is to make a promise in each iteration of the while loop, and await it.

Change this:

    return new Promise((resolve, reject) => {
        var breakfastQuery = {"breakfast": true, [whichDiet]: true};
        while (breakfastGoal >= 150) {

to this:

    var breakfastQuery = {"breakfast": true, [whichDiet]: true};
    while (breakfastGoal >= 150) {
        await new Promise((resolve, reject) => {

The code could be improved more, but it is not relevant to your question. For instance, it would be better to make each promise resolve with the value to be added to the array breakfastArr , so that you would have:

        breakfastArr.push(await new Promise((resolve, reject) => {
             // ...
                           resolve(result)
             // ...
        });

And the async function should return that array, so that it does not have to be defined at the top.

Answer 3

The issue here is that you are mixing callback taking functions with promises. The proper way to do this is to wrap only the callback taking functions in promise constructors. The result is some thing like this:

app.get("/meal-plan", async function(req, res) {

  var calorieCount = req.query.calorieCount;
  var mealInput = parseInt(req.query.mealInput);
  var dietInput = req.query.food;
  var goalPerMeal = (calorieCount / mealInput);
  var whichDiet = "diet." + dietInput;

  var breakfastGoal = goalPerMeal;

  function count(query) {
    Food.count(query, function(err, result) {
      if (err) {
        reject(error)
      } else {
        resolve(result)
      }
    });
  }

  function findOne(query, count) {
    return new Promise((resolve, reject) => {
      Food.findOne(query).skip(count).exec(function(err, result) {
        if (err) {
          reject(error)
        } else {
          resolve(result)
        }
      });
    });
  }

  async function getBreakfastArr() {
    let breakfastQuery = {
      "breakfast": true,
      [whichDiet]: true
    };
    let breakfastArr = [];
    while (breakfastGoal >= 150) {
      let count = await count(breakfastQuery);
      let random = Math.floor(Math.random() * count);
      let result = await findOne(breakfastQuery, random);
      breakfastGoal -= result.nutrition.calories;
      breakfastArr.push(result);
    }
    return breakfastArr
  }

  try {
    let breakfastArr = await getBreakfastArr();
    console.log(breakfastArr);

    res.render("meal-plan.ejs", {
      meal: mealInput,
      calories: calorieCount,
      diet: dietInput,
      breakfast: breakfast,
      lunch: lunch,
      dinner: dinner,
      totalCalories: totalCalories
    });

  } catch (e) {
    res.json(e);
  }

});

Some of the Promise libraries had a function called promisify that would take a function taking a callback as its last argument which took node style (err, result) arguments and produced a function that when called returned a promise. If that is available the wrappers get a lot smaller. for example the Food.count wrapper becomes let count = promisify(Food.count); or let count = promisify(Food.count.bind(Food));

Answer 4

You are returning a promise from async function which is not required. You can remove async from the function returning promise. So I suggest removing async from function getBreakfastArr()