javascript - 试图添加一个数组，但结果返回 NaN

Question

所以我有一个名为 hoursString 的字符串，看起来像

4.3|2.4|3.4|3.0|2.64|3.0|1.0|0.0|2.6|3.4|

我将字符串拆分为一个数组，我想做的是将所有数字相加并将其返回到 div“测试”中的 html 页面。

JAVASCRIPT：

var hours=hoursString.split("|");

    var total=0;
    for (var i=0;i<hours.length;i++)
        {
        total += hours[i];
        }
    document.getElementById("test").innerHTML=total;

结果是 NaN。有人可以告诉我我做错了什么吗？谢谢！

Answer 1

4.3|2.4|3.4|3.0|2.64|3.0|1.0|0.0|2.6|3.4|

删除最后一个 |，否则 split 将在数组末尾添加一个空字符串，这将给出 NaN 和 NaN + number 计算结果为 NaN

编辑：是的， parseFloat 也是必要的，否则结果将是一个字符串而不是 NaN

Answer 2

var hoursString = "4.3|2.4|3.4|3.0|2.64|3.0|1.0|0.0|2.6|3.4|",
    hours = hoursString.split("|"),
    total = 0;
for (var i = 0; i < hours.length; i++) {
    total += parseFloat(hours[i]) || 0; // see explanation
}
document.getElementById("test").innerHTML = total;

为什么|| 0？因为它检查字符串是否为""，如果是，则||操作数将返回第二个值，在这种情况下为0。

这将输出25.740000000000002. 请参阅有关“错误”结果原因的答案，这是一个有效的小提琴。

Answer 3

您的问题是，以小时为单位的每个元素仍然是一个字符串值，即使它被写为一个数字。解决此问题的最简单方法是使用 javascripts parseFloat() 函数。

例子：

var hours=hoursString.split("|");

    var total=0;
    for (var i=0;i<hours.length;i++)
        {
        total += parseFloat(hours[i]);
        }
    document.getElementById("test").innerHTML=total;

编辑：从更改parseInt为parseFloat

Answer 4

var hoursString = "4.3|2.4|3.4|3.0|2.64|3.0|1.0|0.0|2.6|3.4|"
var hours=hoursString.split("|");

var total=0;
var idx = 0;
for(idx in hours) {
    total += +hours[idx];
}

alert(total);

小提琴