How to make multiple HTTP requests inside a loop with JS

Question

What I am trying to do is the following: I need to send a request in which an ID should be returned, as soon as I recover this ID triggers another request that finally registers the data on the server. This processing should be done in a repeat structure that iterates my task list in which, at each iteration, two requests should be made one to fetch the user id another to register a task.

Ex:

function consulta_retorna_id(nome){
    return get_id(nome);
 }

 function insere_tarefa(id, tarefa){
    set_tarefa(id, tarefa);
 }

 //person = arquivo json local
 for (x in person) {

    var id = consulta_retorna_id(person[x].nome);
    insere_tarefa(id,person[x].nome);

}

My challenge is to work with the http calls asynchronism, since the requests happen independently but must obey an execution flow in which first recover the id then inserts

Answer 1

A solution I use are callback functions, which are only executed after the request is successful, see the code below as it would look.

function get_id(nome, callback) {
  $.ajax({
    /* sua configuracao ajax*/
    success: function() {
      var id = /*sua configuracaopara obter id*/ ;

      if (callback) {
        callback(id)
      }
    }
  });
}

function insere_tarefa(id, tarefa) {
  set_tarefa(id, tarefa);
}

for (x in person) {

  get_id(person[x].nome, function(id) { //funciton callback
    insere_tarefa(id, person[x].nome);
  });
}