有人可以深入解释这两个调用是如何不同的

Question

这是当我执行以下函数时发生的情况，AjaxCallFive仅在AjaxCallFour被执行后执行。

var ajaxOptionsFour = { 
    type: "GET", 
    url: '/Home/AjaxCallFour', 
    data: { value: '10' }, 
    success: updatePage, 
    error: printError 
}; 

var ajaxFive = function() { 
    return { 
     type: "GET", 
     url: '/Home/AjaxCallFive', 
     data: { value: '10', dumyContent:"" }, 
     success: updatePage, 
     error: printError 
    } 
} 

var a1 = $.ajax(ajaxOptionsFour); 
    var a2 = a1.then(
     function (data) { 
      // .then() returns a new promise 
      return $.ajax({ 
       type: "GET", 
       url: '/Home/AjaxCallFive', 
       data: { value: '10', dumyContent: data.data }, 
       success: function (response) { console.log(response.dumyContent) }, 
       error: function (response) { console.log() } 
      }); 
     }); 

a2.done(function (data) { 
    console.log(data.data + data.waitValue); 
}); 

然而，如果我改变变量A2线如下两个功能同时调用，AjaxCallFive地没有为AjaxCallFour到最先被执行等待执行。

var a2 = a1.then($.ajax(ajaxFive())); 

Answer 1

您仍然需要将处理函数传递给.then()。你传递的承诺从$.ajax()代码

var a2 = a1.then($.ajax(ajaxFive())); 

从$.ajax()调用的返回值返回是不是有什么.then()期待。

应该

var a2 = a1.then(function(data) { 
    return $.ajax(ajaxFive()); 
}); 

通过一个函数传递给.then()，你的第二个AJAX调用不会开始，直到承诺机制实际上电话该功能。

此外，还可以提高ajaxFive()，这样就可以在返回的数据来自之前的步骤通过：

var ajaxFive = function (content) { 
    return { 
     type: "GET", 
     url: '/Home/AjaxCallFive', 
     data: { value: '10', dumyContent: content }, 
     success: updatePage, 
     error: printError 
    }; 
}; 

然后：

var a2 = a1.then(function(data) { 
    return $.ajax(ajaxFive(data.data)); 
});