JavaScript中使用变量访问数组索引出现undefined错误的解决办法

这个问题的核心原因是：从PHP通过json_encode生成的keys实际上是一个JavaScript对象（而非数组），它的键是字符串类型的数字（比如"54"），而你循环中拿到的ordernum是数字类型。虽然JavaScript通常会自动把数字转成字符串来访问对象键，但为了确保兼容性（或者避免某些边缘情况），我们需要显式地将数字变量转换为字符串。

解决方案 #

你已经尝试了用toString()转换变量，这是正确的方向。这里给出优化后的代码，同时加上错误处理，避免因为ordernum无效或者keys中没有对应键而抛出错误：

var customers = <?php if ( isset($customers) ) { echo json_encode($customers); } ?>;
var keys = <?php if ( isset($keystable) ) { echo json_encode($keystable); } ?>;

for ( var i = 0; i < customers.length; i++ ) {
    var ordernum = customers[ i ][ "order" ];
    // 先检查ordernum是否有效，且keys中存在对应键
    if (!ordernum || !keys[ordernum.toString()]) {
        console.warn(`No keys found for order number: ${ordernum}`);
        // 可以选择跳过当前行，或者填充默认值
        table += '<tr bgcolor="#ffffff"><td colspan="4">No keys available</td></tr>';
        continue;
    }
    table += '<tr bgcolor="#ffffff">';
    table += '<td>' + customers[ i ][ "email" ] + '</td>';
    table += '<td>' + customers[ i ][ "org" ] + '</td>';
    table += '<td style="width:450px;">' + customers[ i ][ "notes" ] + '</td>';
    table += '<td>' + keys[ordernum.toString()][ "keys" ] + '</td>';
    table += '</tr>';
}

为什么直接用数字变量不行？ #

当PHP的关联数组（键为数字）被json_encode转换后，会生成一个键为字符串数字的JavaScript对象。比如PHP中的：

$keystable = [54 => ['keys' => 'example_key']];

转成JSON后是：

{"54":{"keys":"example_key"}}

虽然JavaScript中keys[54]理论上会自动转成keys["54"]，但如果ordernum存在类型异常（比如是null、undefined或者非数字值），就会导致keys[ordernum]返回undefined，进而触发Cannot read property 'keys' of undefined错误。显式转换为字符串可以避免这类问题。

另外，你也可以用字符串拼接的方式转换，比如keys["" + ordernum]["keys"]，效果和toString()完全一致，选择你觉得更易读的方式即可。

内容的提问来源于stack exchange，提问作者Dan