Javascript 使用$.when从ajax方法填充全局变量后发生延迟异常

我有一个asp.net页面，可以加载图表和一些表格

当页面加载时，我从服务器检索一些数据&进行一些ajax调用，如下面的代码所示

我需要填充两个全局变量：降雨量和降雨日期

当页面加载时，我有一个函数CalcSummaryStats，它利用这些全局值来计算一些统计数据

我的理解（AJAX和Jquery对我来说是新的）是AJAX请求是异步运行的，因此$.AJAX方法在请求完成之前返回，因此在成功回调运行之前返回

因此，在阅读了一些之后，我可以使用$。当像下面这行这样的方法时

$.when（methodRainCont（），methodRainSingle（））.then（calcData）

在methodRainCont中绘制图表，同时在该函数中填充RainDates

在methodRainSingle中，填充另一个全局变量

我的理解是，这意味着一旦两个方法都运行完毕（假设包含成功回调），我的函数calcData就会被调用。calcData调用$（document.ready）块之外的另一个函数，名为CalcSummaryStats&这就是我的错误发生的地方

它尝试下面的一行

var cM=RainDates[0]。getMonth（）

但是你会得到这个错误

延迟异常：无法读取未定义类型的属性“getMonth”错误：无法读取未定义类型的属性“getMonth”

所以看起来好像没有人居住？我想使用$。在调用calcData之前，什么时候可以确保两个函数都已成功运行

我的JS文件

// my two global variables
var Rainfall = [];
var RainDates = [];

$(document).ready(function () {

 var $opts = $('#optList');

 $.ajax({
    type: 'GET',
    url: 'api/UserOptions',
    dataType: 'json',
    success: function (codes) {
        $.each(codes, function (i, code) {
            $opts.append('<li id="' + code + '">' + code + '</li>');
        });
    },
    error: function () {
        alert("Error ");
    }
});

 function methodRainCont() {
    $.ajax({
        type: 'GET',
        url: 'api/RainContr',
        dataType: 'json',
        success: function (data) {
            DrawChart(data);
        },
        error: function () {
            alert("Error");
        }
    });
}

function methodRainSingle() {
    $.ajax({
        type: 'GET',
        url: 'api/RainSingle',
        dataType: 'json',
        success: function (data) {
            Rainfall = data;                // setting my global variable values
        },
        error: function () {
            alert("Error");
        }
    });
}


$.when(methodRainCont(), methodRainSingle()).then(calcData);

function calcData()
{        
    var cords = {
        x: {
            min: RainDates[0],
            max: RainDates[RainDates.length - 1]
        }
    };

    CalcSummaryStats(cords);
}


});

//我的两个全局变量
var降雨量=[]；
var RainDates=[]；
$（文档）.ready（函数（）{
var$opts=$（“#optList”）；
$.ajax({
键入：“GET”，
url:'api/UserOptions'，
数据类型：“json”，
成功：功能（代码）{
$。每个（代码、功能（i、代码）{
$opts.append（“
“+code+”
”）；
});
},
错误：函数（）{
警报（“错误”）；
}
});
函数methodRainCont（）{
$.ajax({
键入：“GET”，
url:'api/RAINCTR'，
数据类型：“json”，
成功：功能（数据）{
图纸（数据）；
},
错误：函数（）{
警报（“错误”）；
}
});
}
函数methodRainSignle（）{
$.ajax({
键入：“GET”，
url:'api/RainSingle'，
数据类型：“json”，
成功：功能（数据）{
雨量=数据；//设置我的全局变量值
},
错误：函数（）{
警报（“错误”）；
}
});
}
$.when（methodRainCont（），methodRainSingle（））.then（calcData）；
函数calcData（）
{        
var跳线={
x:{
min:RainDates[0]，
最大值：RainDates[RainDates.length-1]
}
};
CalcSummaryStats（跳线）；
}
});

您的函数

methodRainCont（）

和

methodRainSingle（）

不会返回由

$使用的承诺。当（）

时，会立即执行

calcData（）

，并且ajax调用不会完成

因此，在这些函数中，用

return$.ajax（{