【问题标题】:Return Zero if input value is NaN [duplicate]如果输入值为 NaN,则返回零 [重复]
【发布时间】:2016-10-26 04:39:23
【问题描述】:

有没有最好的方法来防止NaN?我有数字输入字段,每当我清除该字段时,我都会得到NaN

_amount: function(e) {
  var value = parseInt(e.target.value);
  var newValue = (value === NaN ? 0 : value); // Thought this could work
},

<input type="number" value={this.state.amount} onChange={this_amount} />

现在在我的渲染中我有400 - this.state.amount。事情是,当我清除输入字段时,金额状态为null。如何防止这种情况?当我清除该字段时,是否有可能得到零?假设我输入3 然后清除字段,NaN 会弹出。

谢谢

【问题讨论】:

  • 真的吗,Sylar?您认为以前没有人问过如何在 JavaScript 中检查数字是否为 NaN?
  • 我对这个网站、Stack Overflow 以及它的大多数用户都很感兴趣。我注意到恶霸喜欢捕食新手。那些恶霸是那些不假思索就投反对票的人。是的,我应该研究过,但我忘了。也许是要先研究的通知?妈的,能删帖吗?不!因为已经给出了答案。
  • 您似乎过于个人化了这些反对意见。除其他外,downvote 按钮适用于研究不足的问题。这就是它存在的原因。这并不是要“欺负”你。你不是受害者,你只是一个提出问题而不试图先回答的人。
  • @DavidS,考虑到@Sylar 的问题[显然] 是对 React 状态管理错误的反应,我认为这很好。一点指导会更有帮助。例如使用虚假评估将是一个有用的提示 - value={this.state.amount || 0}
  • @BradGreens - 绝对同意 - 我一直在写 react 一段时间,但遇到了类似的问题。顺便说一句,在输入错误的情况下将值强制为零会产生糟糕的用户体验,其中有一个无法删除的零。我改为使用value={this.state.amount || ''},其中强制为空字符串意味着您可以一直删除数字 - FWIW

标签: javascript math reactjs nan


【解决方案1】:

NaNis 从不等于任何东西,包括NaN 本身,因此依赖于Number.isNaN(value) 方法。

_amount: function(e) {
  var value = parseInt(e.target.value);
  var newValue = (isNaN(value) ? 0 : value);

  //OR sorthand as `NaN` is falsey
  var value = parseInt(e.target.value) || 0;
}

isNaN 函数的必要性

与 JavaScript 中的所有其他可能值不同,不可能依赖相等运算符(=====)来确定值是否为 NaN,因为 NaN == NaN 和 @987654332 @ 评估为假。因此,isNaN 函数的必要性。[Ref]

【讨论】:

    【解决方案2】:

    我找到的最短路径是

    var number = (yourVariable || 0)
    

    因为NaN 是一个虚假值,所以只要yourVariable 是NaN,它就会返回0。

    一种检查数字是否为 NaN 的方法是使用 isNaN 函数。

    isNaN(yourVariable); // Returns true is yourVariable is NaN
    

    旁注:

    上述方法也可以用于多个问题。例如:从数组中获取值(可能不存在)并从二维数组中获取值。

    从数组中获取值:

    yourArray[i] || 0
    

    i 是你要访问的 id

    从二维数组中获取值:

    (yourArray[i] || [])[j] || 0
    

    其中ij是数组中元素的位置

    【讨论】:

    • 0||0 也返回 0 所以这不仅仅是对 NaN 的测试
    • @evan058 我想我不明白
    • 如果输入为NaN,OP 要求返回0。如果输入为NaN0,您建议的测试将返回0,这与他们要求的不完全一致。
    • 输入为0时会误报
    • 我明白了,所以在您想用0 替换NaN 的受限情况下,它可以正常工作,因为您将用0 替换0。但我的意思是,它也会默默地用0 替换任何“虚假”值,包括NaN0falsenullundefined""
    猜你喜欢
    • 2016-05-30
    • 2021-04-29
    • 1970-01-01
    • 2015-07-11
    • 1970-01-01
    • 1970-01-01
    • 2015-03-14
    • 2016-01-19
    • 1970-01-01
    相关资源
    最近更新 更多