then函数内的jquery ajax调用

时间:2018-11-25 01:03:30

标签: javascript jquery ajax promise

所以我需要两个ajax调用来获取所有数据。我正在使用jQuery的ajax调用来实现这一点。但是,我对执行顺序有些困惑。这是我有问题的代码:

$.ajax({
type: "GET",
url: "/api/data",
dataType: "json"
}).then(function (data) {
   console.log("I am the first")//correct
}).then(function () {
   //second ajax
    $.ajax({
    type: "GET",
    url: "/api/lifecyclephase",
    dataType: "json"
    }).then(function (data) {
       console.log("I am the second")//third
    })
 }).then(function () {
     console.log("I am the third")//second
 })

输出为

I am the first
I am the third
I am the second

then是否应该等待第二个ajax完成工作才能继续?

正确的一个:

$.ajax({
  type: "GET",
  url: "/api/data",
  dataType: "json"
}).then(function (data) {
  console.log("I am the first")
}).then(function () {
  $.ajax({
    type: "GET",
    url: "/api/lifecyclephase",
    dataType: "json"
  }).then(function () {
    console.log("I am the second")
  }).then(function(){
    console.log("I am the third")
  })
})

2 个答案:

答案 0 :(得分:1)

“第二个” $.ajax在第二个.then中被初始化,但是$.ajax没有与任何东西链接 else-解释器初始化请求,仅此而已,因此,当到达第二个.then的末尾时, next .thenthird)立即执行

尝试return代替第二个Promise-如果先前的{{1}返回了.then,则后续的Promise将仅等待Promise来解决。 }:

.then

答案 1 :(得分:1)

在有问题的代码中,您只是缺少了return

$.ajax({
    type: "GET",
    url: "/api/data",
    dataType: "json"
}).then(function (data) {
    console.log("I am the first");
}).then(function () {
    return $.ajax({
    ^^^^^^
        type: "GET",
        url: "/api/lifecyclephase",
        dataType: "json"
    }).then(function (data) {
        console.log("I am the second");
    });
}).then(function () {
    console.log("I am the third");
});

如果没有return,则没有任何内容可以告知外部承诺链内部承诺的退出,因此,外部链不会等待内部承诺解决才进入第三阶段。