【问题标题】:Trying to add up an array, but result returns NaN试图添加一个数组,但结果返回 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。有人可以告诉我我做错了什么吗? 谢谢!

【问题讨论】:

    标签: javascript html add 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

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 2014-04-21
          • 1970-01-01
          • 2014-08-07
          • 2015-03-16
          • 2022-01-10
          • 1970-01-01
          • 2020-04-24
          相关资源
          最近更新 更多