如何获取嵌套在其他对象内部的对象的属性值

问题根因 #

你的代码核心错误是对象属性访问逻辑不符合JS语法规则：

1. person对象本身没有名为nameList的属性，nameList是你独立定义的、存储person属性名的外部数组
2. 当你需要把变量/数组元素的值作为对象的属性名访问时，不能使用.点语法，必须使用[]方括号语法

你写的person.nameList[rowCount]会被JS解析为「先取person的nameList属性值，再取该值的第rowCount个元素」，但person没有nameList属性，这一步返回undefined，再尝试读取undefined的下标属性就会抛出你遇到的报错。

修正后可运行代码 #

const nameList = [
    'XYZ',
    'ABC',
    'PQR'
];

var person = {
    XYZ: {
        name: 'XYZ',
        age: 30
    },
    ABC: {
        name: 'ABC',
        age: 40
    },
    PQR: {
        name: 'PQR',
        age: 50
    }
};

var rowCount = 0;
var releaseTableHTML = '';
// 顺带优化thead标签写法，标准HTML中thead内部需要包裹tr标签
releaseTableHTML += '<table><thead><tr><th colspan="2">Just Testing</th></tr></thead><tbody><tr><th>Name</th><th>Age</th></tr>';
while (nameList.length > rowCount) {
    // 核心修改：用方括号传入动态属性名取值
    const currentPerson = person[nameList[rowCount]];
    releaseTableHTML += '<tr><td>' + currentPerson.name + '</td><td>' + currentPerson.age + '</td></tr>';
    rowCount++;        
}
releaseTableHTML += '</tbody></table>';

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