有人可以深入解释这两个电话有何不同答案

【问题标题】：Can someone explain in depth how those two calls were different有人可以深入解释这两个电话有何不同
【发布时间】：2017-04-25 21:05:01
【问题描述】：

这是我执行以下函数时发生的情况，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()));

【问题讨论】：

因为您正在调用 Ajax 调用并存储它返回的内容。在这种情况下，它是一个被返回的承诺。

标签： javascript ajax promise

【解决方案1】：

您仍然需要将处理函数传递给.then()。您在代码中传递了从 $.ajax() 返回的 Promise

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

$.ajax() 调用的返回值不是 .then() 所期望的。

应该是

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

通过将函数传递给.then()，直到 Promise 机制真正调用该函数后，您的第二个 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));
});

【讨论】：