迭代数组不按顺序执行操作？

Question

下面的代码,当运行时工作,但它似乎不知何故不按顺序附加帖子(有时post_2是第一和post_4第二):

var posts = [
    "post_1.md",
    "post_2.md",
    "post_3.md",
    "post_4.md",
    "post_5.md",
    "post_6.md",
    "post_7.md"];

for (var i in posts) {
    $.ajax({
        url: "posts/" + posts[i],
        context: document.body,
        success: function (mdText) {
            var converter = new Showdown.converter();
            var htmlText = converter.makeHtml(mdText);
            $("body").append(htmlText);
        }
    });
}

它遍历数组中的元素,并为每个元素下载Markdown文档,将其转换为HTML,并将其附加到正文.我尝试了一个简单的for循环以及Underscore的_.each()功能.这三个都有相同的结果,在运行时它们不会按顺序附加文档(所以当我点击刷新时,标题的顺序不同).任何想法为什么会发生这种情况并找到解决办法？

Answer 1

$.ajax是一个异步函数,意味着你的所有$.async函数都是并行发生的,它们将按照它们完成的顺序附加到正文(这显然可以根据它们提取的文档大小和一般的网络延迟而变化).

您可能希望查看async.js库,它允许您并行运行AJAX调用,然后在完成所有调用后执行回调.您希望使用该async.parallel函数,该函数将每个AJAX调用的结果作为数组传递给最终回调.