Question

我在一个对象中有一个对象，当我想遍历这些对象时。我成功获取了密钥，但没有获得价值。这是我的代码：

let oPlaystation = {
    product: {
        Artikelnummer: 15118903,
        Fabrikantcode: 845784935,
        Merk: "Sony",
        Garantie: "2 jaar",
        Garantietype: "Carry-in-garantie"
    },
    algemeen: {
        platform: "Playstation 4",
        Aanbevolen_voor_virtual_reality: false,            
    },
    opslagcapaciteit: {
        Totale_opslagcapaciteit: "1000 GB",
        Werkgeheugen_uitbreidbaar: true,
        Maximale_capaciteit_geheugenkaart: "8000 GB"
    },
    Bedrade_aansluitingen : {
        Netwerkaansluiting: true,
        HDMI_ansluiting: true,
        USB_aansluiting: true,
        USB_versie: 3.0,
        Aantal_USB_poorten: 2
    }
}

let output = "";
Object.keys(oPlaystation).forEach(section => {    
    output += '<h3>' + section + '</h3>';        
    output += '<dl class="product-specs">';
    let features = Object.keys(oPlaystation[section]);
    features.forEach(attr => {    
    output += '<div class="product-specs__list-item">';
    output += '<dt class="product-specs__item-title">' + attr + '</dt>';
    output += '<dd class="product-specs__item-spec">' + features[attr] + '</dd>';
    output += '</div>';    
    });
    output += '</dl>';
});
document.body.insertAdjacentHTML("beforeend", output);

现在我在<dd>元素中得到未定义的值。是否知道如何解决此问题？

Answer 1

您需要先按第一个键然后再按第二个键

oPlaystation[section][attr]

代替

features[attr]

var oPlaystation = {
    product: {
        Artikelnummer: 15118903,
        Fabrikantcode: 845784935,
        Merk: "Sony",
        Garantie: "2 jaar",
        Garantietype: "Carry-in-garantie"
    },
    algemeen: {
        platform: "Playstation 4",
        Aanbevolen_voor_virtual_reality: false,            
    },
    opslagcapaciteit: {
        Totale_opslagcapaciteit: "1000 GB",
        Werkgeheugen_uitbreidbaar: true,
        Maximale_capaciteit_geheugenkaart: "8000 GB"
    },
    Bedrade_aansluitingen : {
        Netwerkaansluiting: true,
        HDMI_ansluiting: true,
        USB_aansluiting: true,
        USB_versie: 3.0,
        Aantal_USB_poorten: 2
    }
},
    output = '';


Object.keys(oPlaystation).forEach(section => {    
    output += '<h3>' + section + '</h3>';        
    output += '<dl class="product-specs">';
    let features = Object.keys(oPlaystation[section]);
    features.forEach(attr => {    
        output += '<div class="product-specs__list-item">';
        output += '<dt class="product-specs__item-title">' + attr + '</dt>';
        output += '<dd class="product-specs__item-spec">' + oPlaystation[section][attr] + '</dd>';
        output += '</div>';    
    });
    output += '</dl>';
});

document.body.innerHTML += output;

Answer 2

Object.keys（）返回对象的键数组，因此您无法使用键访问数组中的数据。您可以使用for-in循环替换Object.keys，例如：

    for (const section in oPlaystation) {
        output += '<h3>' + section + '</h3>';
        output += '<dl class="product-specs">';
        let features = oPlaystation[section];
        for (const attr in features) {
            output += '<div class="product-specs__list-item">';
            output += '<dt class="product-specs__item-title">' + attr + '</dt>';
            output += '<dd class="product-specs__item-spec">' + features[attr] + '</dd>';
            output += '</div>';    
        }
        output += '</dl>';
    }

如何获得迭代对象的值

2 个答案: