Question

我正在使用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"

第三个只返回undefined，即使从第二个剪辑 - 你可以看到数据存在。

怎么回事？

Answer 1

“Ajax”中的“A”代表“异步”。这意味着当您执行ajax请求时，会立即继续执行$.ajax()函数中readCSV()之后的下一行，而无需等待响应。因此，您的readCSV()函数在响应之前返回，因此应该返回{"columns":[], "rows":[]}。稍后，当收到回复时，您的success回调将被执行，但到那时您的populateTable()函数已被调用。

我能想到的唯一解释为什么控制台日志显示任何返回的数据是在某些浏览器中控制台将保留到已记录对象的实时链接。因此，控制台最初会显示Object { columns=[0], rows=[0]}，因为console.log(data)运行时阵列为空（注意零），此时data['columns'][0]为undefined。但是当你在控制台中单击该对象以展开它并查看数组的内容时，将收到ajax响应并且已经填充了数组。

所有这一切的修复只是从populateTable()处理程序中调用success，因为此时数据肯定可用。

数组以更高的粒度返回undefined

1 个答案: