javascript - 如何使用 promises 对对象数组的每个元素进行 ajax 调用？

Question

我有这个代码:

       // _arrOfUsers = array of objects, each object represents a user. 
       //For example, a single object may be something like {name:"mike", id:"123"}    

            var _successUsers = function (_arrOfUsers) {            
                    var promises = [];   //empty array of promises

                        _arrOfUsers.forEach(function (user) {
                            promises.push(function () {
                                return $.Deferred(function (dfd) {
                                     $.post("//sessionID",
                                                queryServ.getAllUserDomainCommentsFunc("//currentDomainID", user.iD, "//currentDomainID", "//currentURL"),
                                        'text', 'text/plain', this,
                                        function (dataX) {
                                            dfd.resolve(dataX);
                                        });
                                }).promise();
                            });
                    });

                    $.when(promises).then(function (results) {
                        console.log(results);
                    });

                };

理解这段代码的一些要素:

**** Ajax 调用设置

• url: sessionURL
• data:发送到服务器的数据是对模块的外部调用queryServ.js 和函数 getAllUserDomainCommentsFunct返回一个 JSON 对象。它需要这些参数才能工作:currentDomain、userID、currentDomain(再次)、currentURL
• 类型:文本
• 内容类型:文本/纯文本
• 上下文:这个

**** 评论是一个类似于 {id: "998", textOfcomment:"I commented this", target: "//targetID"} 的 jsonObject。

我想做的是对数组“_arrOfUsers”的每个用户进行ajax 调用，以提取他在服务器上的所有评论；在所有“提取”之后，我需要获得所有结果(即所有用户的所有评论)并将它们打印在控制台中。顺序对我的代码很重要，这就是我使用 Promises 的原因。

我在 StackOverflow 上的 JSfiddle 上找到了这个算法的结构，但它对我不起作用，因为它返回一个函数数组，我不明白为什么，可能是因为我在我的过程中从未使用过 Promises事业。

提前谢谢你，如果有什么不清楚的地方请随时告诉我。

Answer 1

这里没有必要创建一个 deferred，因为 $.post() 已经返回了一个 promise 并且 $.when() 为你保持了结果的顺序。相反，您可以这样做:

$.when.apply($, _arrOfUsers.map(function(user) {
    return $.post("//sessionID", queryServ.getAllUserDomainCommentsFunc("//currentDomainID", user.iD, "//currentDomainID", "//currentURL"));
})).then(function() {
    // all results available in order here as arguments to this callback
    // arguments[0][0] is the first result
    // arguments[1][0] is the second result
    // arguments[2][0] is the third result and so on 
    for (var i = 0; i < arguments.length; i++) {
        // arguments[i][0] is next one  of your results
    }
});

注意:我不太明白你试图用 $.post() 的参数做什么(你似乎编造了一些 jQuery 文档没有显示的参数)所以我稍微简化了它，但您可能需要调整那些 $.post() 参数以满足您的目的。

---

就个人而言，我鄙视 $.when() 以及它如何与 jQuery ajax promises 交互(使用起来非常困惑)所以我会将 ajax promise 转换为 ES6 promise 并使用 Promise .all()(如果需要旧版浏览器支持，则使用 Bluebird promise 支持)。

Promise.all(_arrOfUsers.map(function(user) {
    return Promise.resolve($.post("//sessionID", queryServ.getAllUserDomainCommentsFunc("//currentDomainID", user.iD, "//currentDomainID", "//currentURL")));
})).then(function(results) {
    // results is an array of results in order
});

或者如果你包含 Bluebird，你可以使用:

Promise.map(_arrOfUsers, function(user) {
    return Promise.resolve($.post("//sessionID", queryServ.getAllUserDomainCommentsFunc("//currentDomainID", user.iD, "//currentDomainID", "//currentURL")));
}).then(function(results) {
    // results is an array of results in order
});