找到对象中的最高值键,然后将其发布到innerHTML

Question

我有一个对象,我正在计算测验问题的结果.

var answerData = {
    "Ninja": { score: 4 },
    "Robot": { score: 1 },
    "Pirate": { score: 7 },
    "Zombie": { score: 2 }
}

我想确定哪个属性最高然后将结果发布到页面.

我在stackoverflow上发现了一篇帖子,建议使用object.reduce()来获得最终结果.我无法让它返回'pirate'的最高值,而是返回'zombie'的最后一个值.

  function finalResults {
        theAnswer = Object.keys(answerData).reduce(function(a, b){ return answerData[a] > answerData[b] ? a : b });

        document.getElementById("finalResulthere").innerHTML = "<p>Congratulations you are a " + theAnswer +".</p>";
}

然后发布到

<div id="results">
  <div id="finalResulthere"></div>
</div>

我的另一个想法是运行链式IF语句,比较每个对象键的值.这似乎更整洁......

Answer 1

你的功能几乎完成,你只是错过了一个细节,你正在比较整个对象,它总是失败.

function finalResults() {
    var theAnswer = Object.keys(answerData).
                reduce(function(a, b){ 
                   return answerData[a].score > answerData[b].score ? a : b }
                );

    document.getElementById("finalResulthere").innerHTML = "<p>Congratulations you are a " + theAnswer +".</p>";
}

你需要使用score属性的值进行比较,这就是你所缺少的