Question

我们正在尝试按特定顺序执行多个AJAX调用。以下代码包含 methodA，methodB 和 methodC （每个代码都返回一个运行 async = true 的AJAX承诺对象。）

它们使用 jQuery 中的 then（）函数进行链接。

 self.methodA().then( self.methodB() ).then( self.methodC() )

我使其中一种方法变慢（ methodB ）（我使用慢速网址）。

我希望 A ......等待10秒......然后 B 然后 C 。

相反，我得到 A，C .... 10秒等待和 B 。

为什么这样做？是否与我在always（）函数中使用alert（）有关？

这是我的小提琴代码： http://jsfiddle.net/h8tfrvy4/13/

代码：

function Tester() {
    var self = this;
    this.url = 'https://public.opencpu.org/ocpu/library/';
    this.slowurl = 'http://fake-response.appspot.com/?sleep=5';


    this.save = function() {
        self.methodA().then( self.methodB() ).then( self.methodC() )
    }

    this.methodA = function () {
        var self = this;

        return $.ajax({
            url: self.url,
            async: true
        }).always(function (processedDataOrXHRWrapper, textStatus, xhrWrapperOrErrorThrown) {

            //check for errors... and if OK
            alert('A OK');


        })
    }
    this.methodB = function () {
        var self = this;

        return $.ajax({
            url: self.slowurl,
            async: true
        }).always(function (processedDataOrXHRWrapper, textStatus, xhrWrapperOrErrorThrown) {

            //check for errors... and if OK
            alert('B OK');


        })
    }
    this.methodC = function () {
        var self = this;

        return $.ajax({
            url: self.url,
            async: true
        }).always(function (processedDataOrXHRWrapper, textStatus, xhrWrapperOrErrorThrown) {
            //OK
            alert('C OK');

        })
    }
}
new Tester().save();

Answer 1

这是错误的：

self.methodA().then( self.methodB() ).then( self.methodC() )

您立即调用每个方法，并将承诺传递给then。

如果你希望每个函数都等到上一个函数完成，你需要给每个then一个回调函数，以便在前一个函数解析时执行：

self.methodA().then(function () { return self.methodB() }).then(function() { return self.methodC() });

Answer 2

简短而简单：

this.save = function() {
    self.methodA().then( self.methodB ).then( self.methodC )
}

它困扰了我所有**＆amp; ^ * $＆amp;那天@meagar是对的，我错了，但我确信我是对的。他的回答似乎太复杂了，但我早上模糊不清，我的回答也不对。这个是正确的答案，当你把它插入JSFiddle时，它可以很好地工作。

为什么then（）链式方法不按顺序运行？

2 个答案: