是否可以在javascript中使用异步方法进行迭代

Question

我有一个带有 Struts 2 的 JSP，包括：

<div id="data">
  <s:include value="list.jsp"/>
</div>

list.jsp 里面有一个迭代器。

使用 JavaScript，我有 3 个函数可以对不同的操作和 Web 服务进行 Ajax 调用，但是这 3 个函数会刷新同一个 Java 对象列表：

function firstCall(product) {
    // an ajax call 
    .done(function(html) {
      $("#data").append(html);
    });
}

function secondCall(product) {
    // an ajax call 
    .done(function(html) {
      $("#data").append(html);
    });
}

function thirdCall(product) {
    // an ajax call 
    .done(function(html) {
      $("#data").append(html);
    });
}

我还有另一个函数可以迭代产品的字符串数组：

function iterate(productos){
    for(i=0;i<productos.length;i++){
        firstCall(productos[i]);
        secondCall(productos[i]);
        thirdCall(productos[i]);
    }
}

我的问题是我需要这三个方法是异步的，因为每个方法都需要大约 10 秒。 =(

有更好的方法吗？

Answer 1

如果您不关心旧版浏览器（不支持 ES6），您可以使用 Promise。 会变成

new Promise(firstCall(productos[i]));
new Promise(seccondCall(productos[i]));
new Promise(thirdCall(productos[i]));
//You can add .then(function(){"code"}) to do something after it's done.

您的方法应该有两个新参数：resolve 和 reject，它们是解析或拒绝承诺的函数。所以 .then 有效。

如果您关心旧版浏览器，您可以使用另一个实现 https://www.promisejs.org/ 或查看 is there a way to implement promises in ie9+

参考https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise