使用jQuery的功能承诺

Question

我正试图从Phoenix web应用程序下载一些数据，并在前端呈现这些数据。为此，我将请求和回调放在一个列表中，并在then处理每个请求时对其运行list.reduce。

var Database = function() {
  this.reservations = [];
  this.applications = [];
  this.environments = [];
};
var database = new Database();
var requests = [$.getJSON('/api/applications', data => { database.applications = data }),
                $.getJSON('/api/environments', data => { database.environments = data }),
                $.getJSON('/api/reservations', data => { database.reservations = data })];
function run() {
  requests.reduce(function(chain, callback) {
      return (chain ? chain.then(callback) : callback);
  }, null).then(() => render(database));
}

然而，这在最新版本的谷歌浏览器中大部分时间都有效，在Safari中可能有10%的时间有效。

当我在进入渲染功能后检查"数据库"时，我会看到应用程序列表，但不会看到环境和保留(2条数据(。

编辑：好的，所以它可以在谷歌Chrome正常模式下工作。但并不是一直在隐姓埋名模式下工作。在Safari中，它有时会获取全部3条数据，有时只获取2条数据。我的应用程序不使用任何会话。

我猜这是由于$.ajax是异步的，也许我违背了我的承诺。但我遇到了一个障碍。

有什么见解吗？

Answer 1

您不需要连锁您的承诺，它们可以同时被请求，因为看起来它们中的任何一个都不相互依赖。相反，您可以使用.map()并获取结果，这将是一个承诺列表，并使用.all()等待它们全部解决。

(我有一些自由，所以下面应该被视为伪代码(

var urls = ['whatever.com', 'example.com/something', 'something.com/whatever'];
var requestPromises = urls.map(function(url) {
    return ajax(url); // assume ajax() returns a promise
});
Promise.all(requestPromises).then(function(results) {
    console.log(results);
});

Answer 2

感谢@Soviut的帮助。结束语：以下是我为解决这个问题所做的工作。

// ... is the ES6 spread operator
function run() { 
  $.when(...requests).then(() => {
    render(database);
  });
}