javascript - 当两个单独的 Ajax 调用完成时，调用函数的好方法是什么？

Question

所以我有一些类似于以下简化版本的JS:

var MyAjax = $.ajax({
    url: 'api/myApi',
    type: "POST",
    data: myData,
    dataType: "json",
    success: function (data) {
        if (condition) {
            var weightCounts = $.ajax({
                url: 'api/myApi',
                type: "POST",
                data: myConditionalData,
                dataType: "json",
                success: function (conditionalData) {
                    MyExternalMethod(data, conditionalData)
    }
});

基本上我有两个 Ajax 调用。我有一个可以检索一些数据，第二个可以在启用附加设置的情况下检索一些数据。条件调用嵌套在主调用的成功事件中的原因是因为 MyExternalMethod() 的参数是由这些调用生成的，因此它们都需要完成。

但从概念上讲，这些调用是完全相互独立的，并且条件调用不需要等待初始调用的成功事件，这只是我在编写此代码时能想到的最佳方法。我想重构它以解决等待第一个请求执行条件的缓慢问题，但我不确定最好的方法。

到目前为止我最好的想法是这样的:

var firstData = null;
var secondData = null;

var MyFirstAjax = $.ajax({
    url: 'api/myApi',
    type: "POST",
    data: myData,
    dataType: "json",
    success: function (data) {
        firstData = data;
        if (secondData){
            MyExternalMethod(firstData, secondData)
        }

});

var MySecondAjax = $.ajax({
    url: 'api/myApi',
    type: "POST",
    data: myData,
    dataType: "json",
    success: function (data) {
        secondData = data;
        if (firstData){
            MyExternalMethod(firstData, secondData)
        }
});

除了使用这些变量作为标志之外，还有标准方法吗？对于 JS 的工作，我已经习惯了凭感觉行事，但我正在尝试编写更干净、更面向标准的代码，所以我想知道是否有比上面更有利的方法(或者上面是否有我没有看到的任何主要缺点)。

谢谢

Answer 1

您可以使用$.when() ...

var MyFirstAjax = $.ajax({
    url: 'api/myApi',
    type: "POST",
    data: myData,
    dataType: "json"
});

var MySecondAjax = $.ajax({
    url: 'api/myApi',
    type: "POST",
    data: myData,
    dataType: "json"
});

$.when(MyFirstAjax, MySecondAjax).then(function (firstResult, secondResult) {
    var firstData = firstResult[0];
    var secondData = secondResult[0];
    MyExternalMethod(firstData, secondData)
});