循环遍历对象数组？答案

【问题标题】：Loop through an array of objects?循环遍历对象数组？
【发布时间】：2016-09-07 00:18:14
【问题描述】：

我正在尝试创建一个印花税计算器。

目前，我有一个包含 3 个属性的对象数组，每个对象都有相同的属性名称但值不同。

如果单击按钮，我正在尝试遍历此数组以将属性 1 和 2 附加到表格行，但是循环仅附加第一个对象属性，而不附加其他对象。

我知道有类似的查询，但没有一个有帮助。我确定我缺少一些简单的东西。

我还附上了一张img以便更好地理解问题

这是我的代码

         var taxbands = [
         {
             min: 0,
             max: 125000,
             percent: 0
         },
         {
             min: 125000,
             max: 250000,
             percent: 0.02
         },
         {
             min: 250000,
             max: 925000,
             percent: 0.05
         },
         {
             min: 925000,
             max: 1500000,
             percent: 0.1
         },
         {
             min: 1500000,
             max: null,
             percent: 0.12
         }
     ]

     var tableRow = "<tr><td>{taxband}</td><td>{percent}</td><td>{taxable}</td><td>{TAX}</td></tr>";

     $('#calculate').on('click', function calculateButton() {
        calculateStampDuty();
     })

     function calculateStampDuty() {

        var userInput = parseInt($("#input-value").val());

        for (i = 0; i < taxbands.length; i++) {
            if (userInput < 125000) {
                tableRow = tableRow.replace("{taxband}", taxbands[i].min + "-" + taxbands[i].max);
                $("#explained-table").append(tableRow);
            }
        }

     }

【问题讨论】：

#input-value 在它不起作用的情况下有什么价值？
第一次替换“tableRow”字符串中的{taxband}后，下次就不再存在了！
另外，在该函数中声明i 和var！
任何低于 125000 的东西，我只包括它，因为我需要检查一些东西，但它不应该对它有任何影响

标签： javascript arrays loops object

【解决方案1】：

这是因为您将“tableRow”的替换值分配回“tableRow”。第一次迭代后，tableRow 不再包含“{taxband}”，replace 无效。

tableRow = tableRow.replace("{taxband}", taxbands[i].min + "-" + taxbands[i].max);
                $("#explained-table").append(tableRow);

你应该添加一个中间变量：

var myRow = tableRow.replace("{taxband}", taxbands[i].min + "-" + taxbands[i].max);
                $("#explained-table").append(myRow );

【讨论】：