每次循环存储随机顺序的数组

我试图将多个对象存储到一个数组中，然后按顺序渲染。

我的过程如下：

app.js

var allOdds = []; var count = 0; // ===================================== /* Database Config and Error Handling */ // ===================================== tools.databaseConnect(); // Get option number from database connection.query("SELECT * FROM OptionNumbers ORDER BY id", function(err, rows, fields) { console.log("CALL FROM DATABASE"); var totalRows = rows.length; rows.forEach(function(key, value) { request('http://url/for/data' + key.number, function(error, response, body) { if (!error && response.statusCode == 200) { // Parse XML response if (body.includes('selection')) { var odds1 = $(body).find('selection').eq(0).attr('odds'); var odds2 = $(body).find('selection').eq(1).attr('odds'); var obj = { team1odds: odds1, team2odds: odds2 }; allOdds.push(obj); } else { var obj = { team1odds: 0.00, team2odds: 0.00 }; allOdds.push(obj); } if ((count + 1) === totalRows) { // Render index with results res.render('index', { title: 'Best Bets', time: tools.DisplayCityTime('+12'), completeOdds: allOdds }); } count++; } //end if || Nothing Odds Found }); }); }); 

数据库中“key.number”的顺序是一致的，但是存储对象的过程顺序似乎是随机的？

 <% completeOdds.forEach(function(sortedOdds) { %> <div class="rowContainer" style="width:500px; padding:20px; margin-bottom:20px; border:2px solid grey;"> <p style="width:50%; float:left;"> <%= sortedOdds.team1odds %> </p> <p style="width:50%; float:left;"> <%= sortedOdds.team2odds %> </p> <div style="clear:both; width:100%;"></div> </div> <% }); %> 

渲染的结果顺序是随机的，例如下面的例子1 – 3 – 2，3 – 1 – 2等…

我想从API中检索。 然后将每个数据存储到一个数组中，按照检索的顺序在页面上呈现。

Answer 1

问题是你不能确定哪个请求按照什么顺序完成。 想象一下，在单独的标签中一个接一个地加载三个单独的网页。 不能保证他们会按照您打开的顺序完成加载。

使用JavaScript承诺是解决这个问题的一种方法。 我创build了一个名为promises的空数组。 对于每个请求，您创build一个新的承诺。 根据request(...)的结果request(...)这个承诺将被“解决”或“被拒绝”。 这个承诺现在按照你想要的顺序推到数组promises 。

一旦arrays中的所有承诺都已经解决， Promise.all(promises)将被解决。 其parsing的值将是一个数组，其中包含先前请求的parsing值。

 var promises = []; rows.forEach(function (key, value) { var p = new Promise(function (resolve, reject) { request("...", function (error, response, body) { if (error) { //handle error } else { resolve(body); } }); }); promises.push(p); }); //this function will not be called until all requests have returned Promise.all(promises).then(function (resp) { //these will be in order console.log(resp[0]); console.log(resp[1]); console.log(resp[2]); });