Waiting for data from async nested Functions within JQuery $.each in Javascript

Question

this is a follow up question to Asynchron Errorhandling inside $.each. As mentioned in the comments there, i want to handle data after the last async job from a $.each loop.

So for instance:

  var errors = 0;
  var started = 0;
  var successful = 0;
  $.each(..., function(){
    started++;
    connection.query('INSERT INTO tableName SET ?', post, function(err, result) 
    {
      if (err) {
        if (err.code === 'ER_DUP_ENTRY')
          { errors++; }
        else
          { throw err; }
      } else { successful++;}
      if (started == successful + errors) {
         // all done
         console.log(errors + " errors occurred");
      }
    });
  });

In this case everything logs out properly when the // all done comment is reached. But what if i want to use this data later on instead of just logging it out.

Is there a way to wait for this data outside of the $.each scope? Or do i always have to handle everything in the nested function?

Answer 1

You can use promises instead

var promises = [];

$.each(..., function() {
    var promise = new Promise(function(resolve, reject) {;
        connection.query('INSERT INTO tableName SET ?', post, function(err, result) {
            if (err) {
                resolve(err.code);
            } else {
                resolve(result);
            }
        });
    });
    promises.push(promise);
});


var result = Promise.all(promises);

And then when you want to use the data, you do

result.then(function(data) {
    // use data array looking like ["result data", "result data", "ER_DUP_ENTRY" .. etc]
})