Javascript 在更高粒度下返回未定义的数组

我正在使用AJAX将CSV文件读入数组对象。我遇到的问题是，数据被正确读取并且似乎在对象中，但是如果我向下移动层，我会得到未定义的消息。即使在物体的俯视图中，一切都在那里。我认为这可能与时间有关，因为我正在处理大量数据

JS

$(document).ready(function () {
    var data = readCSV();
    populateTable(data);
});

function readCSV() {
    var data = {"columns":[], "rows":[]};

    $.ajax({
        url : 'assets/php/readCSV.php',
        type : 'POST',
        success : function (csv) {
            var colCount = csv[0].length,
                rowCount = csv.length;

            for (var c = 0; c < colCount; c++) {
                data['columns'][c] = csv[0][c];
            }

            csv.splice(0,1);

            for (var r = 0; r < rowCount; r++) {
                data['rows'][r] = csv[r];
            }
        },
        error : function () {
            alert("Error: Unable to read the CSV file. Please try again.");
        }
    });

    return data;
}

function populateTable(data) {
    console.log(data); // Outputs all the data as expected.
    console.log(data['columns']); // Shows the columns data as expected
    console.log(data['columns'][0]); // Returns undefined
}

剪断第二个控制台日志

Object { columns=[0],  rows=[0]}
columns     ["EXPERIMNT CODE", "EXPERIMNT_NAME", "VarCode", 12 more...]
rows    [["H1225", "COP - Show star rating a...ting in the price panel", "H1225:001.000", 12 more...], ["H1225", "COP - Show star rating a...ting in the price panel", "H1225:001.001", 12 more...], ["H1225", "COP - Show star rating a...ting in the price panel", "H1225:001.002", 12 more...], 4873 more...]

[]          
0   "EXPERIMNT CODE"
1   "EXPERIMNT_NAME"
2   "VarCode"
3   "VarName"
4   "Version Number"
5   "Reporting Range Start Date"
6   "Reporting Range End Date"
7   "Status"
8   "Transaction Date"
9   "EXPERIMNT TEST ID"
10  "Test Manager"
11  "Product Manager"
12  "Pod"
13  "Record_Update_Datetm"
14  "Insert_datetm"

第三个只是返回未定义的，即使从第二个剪接中可以看到数据在那里

发生了什么？

Ajax中的“A”代表“异步”。这意味着，当您在

readCSV（）

函数中执行ajax请求时，将立即继续执行

$.ajax（）

之后的下一行，而不等待响应。因此，您的

readCSV（）

函数在响应之前返回，因此应该返回

{“columns”：[]，“rows”：[]}

。稍后，当收到响应时，将执行

success

回调，但此时已调用

populateTable（）

函数

对于为什么控制台日志显示任何返回的数据，我能想到的唯一解释是，在某些浏览器中，控制台将保留到日志对象的实时链接。因此，控制台最初显示

Object{columns=[0]，rows=[0]}

，因为

console.log（data）

运行时数组是空的（注意零），而

data['columns'][0]

当时是

未定义的。但是，当您在控制台中单击该对象以展开它并查看数组的内容时，ajax响应将被接收并且数组已被填充

解决所有这些问题的方法就是从
success
处理程序中调用
populateTable（）
，因为在这一点上，数据肯定是可用的