JavaScript数组中从子菜单获取对象遇异常，输出出现undefined

你的代码输出不符合预期的核心原因是：第一个菜单项的submenu是数组类型，而非单个对象，直接访问e.title（此时e是数组）会返回undefined。要实现需求，需要遍历submenu数组取出每个子项的title；没有submenu的项则直接输出自身的title。

修正后的打印代码 #

const menu = [
    {
        title: "1",
        submenu: [
            { title: 'gilbert lua' },
            { title: 'pemai' },
        ],
    },
    { title: "2" },
    { title: "3" }
];

menu.forEach((item) => {
    if (item.submenu) {
        // 遍历子菜单数组，逐个打印子项的title
        item.submenu.forEach(subItem => {
            console.log(subItem.title);
        });
    } else {
        // 无submenu时直接打印自身title
        console.log(item.title);
    }
});

输出结果 #

gilbert lua
pemai
2
3

如果需要将结果收集到数组而非直接打印，可使用以下代码：

const result = [];
menu.forEach((item) => {
    if (item.submenu) {
        item.submenu.forEach(subItem => {
            result.push(subItem.title);
        });
    } else {
        result.push(item.title);
    }
});
console.log(result); // 输出：["gilbert lua", "pemai", "2", "3"]

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