Ajax API вызовов в цикле должны быть выполнены для того,

Question

позволяет сказать, что у вас есть сценарий, где вам необходимо создать выходной .csv в текстовом поле страницы только ...

Так у меня есть массив запросов, которые я петля , Внутри цикла im передается запрос на вызов ajax ... Мне нужно добавить результат вызова ajax в текстовое поле.

Мой вопрос заключается в том, как вы получите результаты, напечатанные в порядке, они запрашиваются (в основном порядка в массиве запросов)

//example array to loop. 
var queries= ['query1', 'query', 'query3', 'query4']; 

//the textarea where im going to print the results in order later to open in excel as a .csv file 
var $csvText= $('#some-text-area'); 

//inserting the csv headers 
$csvText.val('Column1, Column2\r\n'); 

$.each(queries, function(index, value){ 
    //someGoogleAPI is an ajax call from google's api 
    someGoogleAPI(value).then(function(response){ 
     //Adding row with values 
     $csvText.val(response.column1 + ',' response.column2 + '\r\n'); 
    }); 
}) 

Это упрощенный пример, но при решении этого я хотел бы получить представление о том о том, как решить мою проблему.

Спасибо, ребята.

Answer 1

Оказывается, что ваши запросы не зависят друг от друга и, таким образом, могут быть выполнены параллельно. Если это так, то вам просто нужно получить ответы, обработанные по порядку. Вы можете сделать это несколькими способами:

работать параллельно с Promise.all()

Launch все запросы параллельно, собрать все результаты, используйте Promise.all() знать, когда они все сделали, а затем вставить все результаты.

//example array to loop. 
var queries= ['query1', 'query', 'query3', 'query4']; 

//the textarea where im going to print the results in order later to open in excel as a .csv file 
var $csvText= $('#some-text-area'); 

//inserting the csv headers 
$csvText.val('Column1, Column2\r\n'); 

Promise.all(queries.map(function(item) { 
    return someGoogleAPI(value); 
})).then(function(results) { 
    $csvText.append(results.map(function(item) { 
     return response.column1 + ',' response.column2; 
    }).join('\r\n'));  
}); 

Promise.all() будет собирать результаты в порядке, независимо от того, какие запросы фактически закончил первый.

Последовательность ваших операций

Вы можете последовательность ваших операций, так только один запускается в то время, это результат вставляется, то следующий будет работать и так далее. Это будет более медленное сквозное время выполнения, но даст вам промежуточное отображение результатов.

//example array to loop. 
var queries= ['query1', 'query', 'query3', 'query4']; 

//the textarea where im going to print the results in order later to open in excel as a .csv file 
var $csvText= $('#some-text-area'); 

//inserting the csv headers 
$csvText.val('Column1, Column2\r\n'); 

queries.reduce(function(p, item) { 
    return p.then(function() { 
     return someGoogleAPI(item).then(function(result) { 
      $csvText.append(result.column1 + ',' result.column2 + '\r\n'); 
     }); 
    }); 
}, Promise.resolve()); 

Это создаст ряд сцепленных обещаний, которые будут выполнены в порядке, один за другим, что каждый из них, вставив его результат, когда он приходит.

Answer 2

Вместо $ .each вы можете использовать сокращение для создания произвольного списка обещаний.

queries.reduce(function(seq, val) { 
    return seq.then(function() { 
     return someGoogleAPI(val) 
    }) 
    .then(function(response){ 
     var curr = $csvText.val(); 
     $csvText.val(curr + ',' + response.column1 + ',' + response.column2 + '\r\n'); 
     }); 
}, Promise.resolve()); 

jsfiddle: https://jsfiddle.net/75sse6n2/