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

Posted 2023-03-14

【中文标题】试图添加一个数组，但结果返回 NaN

【英文标题】：Trying to add up an array, but result returns NaN

【发布时间】：2013-06-07 20:14:09

【问题描述】：

所以我有一个名为 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。有人可以告诉我我做错了什么吗？ 谢谢！

【参考方案1】：

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);

FIDDLE

【参考方案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。请参阅 this answer 了解“错误”结果的原因，并参阅 here is 工作小提琴。

【参考方案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

【讨论】：

抱歉，请尝试使用 parseFloat()，因为您正在处理小数。

【参考方案4】：

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