在JavaScript中将字符串转换为数字

Question

我想解析包含经度和纬度的用户输入。我的目标是将字符串强制转换为数字，保留其符号和小数点位置。但当用户的输入无效时，我想显示一条消息。我应该遵循哪个方案？

parseFloat(x)

第二

new Number(x)

第三个

~~x

第四个

+x

- Om3ga

---

不要使用 new Number()，如果需要则使用 Number()。这取决于您认为哪种类型的输入是有效的。例如，parseFloat将接受 "123foo" 并返回 123，但 Number（或一元的 +）将返回 NaN。 - Felix Kling

是的，很好的观点：你可以将 Number() 构造函数作为普通函数使用。 - Pointy

可能是将字符串转换为整数？的重复问题。 - Heretic Monkey

Answer 1

如果我必须从这两个中选择一个的话，我会使用Number(x)，因为它不允许出现末尾垃圾字符（trailing garbage）。虽然它实际上是“允许”的，但结果是一个NaN。

也就是说，Number("123.45balloon")是NaN，但parseFloat("123.45balloon")会作为数字返回123.45。

正如Kling先生所指出的那样，哪个更“好”由您决定。

编辑 — 啊，你已经添加了+x和~~x。正如我在评论中写的那样，+x等同于使用Number()构造函数，但我认为它有一点风险，因为+运算符的语法灵活性。也就是说，剪切和粘贴很容易引入错误。如果你知道你只需要一个整数（32位整数），那么~~x形式是很好的选择。但对于纬度/经度来说，这可能不是你想要的。

- Pointy

---

你对 +x 有什么看法？ - M. Abbas

真的吗？我喜欢 + :) 这个操作符的行为是明确定义的，但对于每个人来说可能并不明显它的意义/作用（类似于 ~~）。 - Felix Kling

好的，@Pointy，谢谢你的回复！但是正如@Felix Kling所说，这对于每个人来说并不明显，个人而言，我更喜欢使用“+”而不是其他函数。 - M. Abbas

@Pointy 使用 + 的好处是速度快，这在我的答案链接中有所体现。 - Engineer

@Pointy，测试表明，取决于浏览器，+ 可能比 Number 更快或更慢。可能在旧的浏览器中，+ 更快，但现在不是这样了。 - Engineer

Answer 2

第一个更好。它是明确的，而且是正确的。你说你想解析浮点数。 ~~x会给你一个整数。

- Ates Goral

---

明确、易读的代码通常更好（除非它过于冗长）。像 ~~x 这样的简洁技巧会降低代码的可读性，除非你真的因为某些原因（比如短的 JavaScript 编码竞赛）而非常紧张。而在你的情况下，~~x 甚至不是一个有效的解决方案，因为它只会给你一个整数。 - Ates Goral

@Hans Z 嗯... ~~ 不会让人困惑吗？我猜“困惑”取决于开发者... - elclanrs

我对 parseFloat() 的唯一问题是它会忽略数字后面的非数字字符。因此，一个以数字开头但以其他随机字符结尾的字符串仍然可以被解析，而且不会是 NaN。当然，对于某些应用程序来说，这可能是可以接受的。 - Pointy

@al0neevenings 为什么不试着用一些简单的示例来看看呢？只需在您的JS控制台中编写此内容，或者转到jsfiddle.net进行实验：parseFloat("-42.42") - Ates Goral

就像我说的那样，这是我的个人偏好，但 +x 更短，并且使用它没有任何问题。（在括号中使用 (+x) 将解决语法问题，而且仍然比 Number(x) 更短 :-) - Pointy

Answer 3

要测试是否为数字，请使用以下代码：

function isNumeric(obj){
    return !isNaN( parseFloat(obj) ) && isFinite( obj );
}

将 String 转换为 Number，使用 +， 这是最快的方法：

一元运算符 + 也会将其操作数转换为数字，并且因为它不执行任何其他数学运算，所以它是将字符串转换为数字的最快方法。

因此，总体而言，您可能需要这样做：

if(!isNumeric(inputValue)){
    alert('invalid number');
}else{
    var num = +inputValue;
}

_{isNumeric 是从 jQuery 借用的}

- Engineer

---

如果你使用 isNumeric 测试，那么 +x 的效率将变得无关紧要 :) 或许在转换后进行 isNaN(num) 检查会更好。 - Ates Goral

@AtesGoral 你建议的方式（我指的是 isNaN）并没有被证明过，而我发布的方式已经得到了证明。所以我会选择更可靠的方法。 - Engineer

Answer 4

这是我写的代码，用于重复获取输入，直到获得正确的输入为止。

var d;

do {
    d = prompt("Enter a number");
    d = new Number(d);
} while( isNaN(d) );

document.write( d );

注意：如果任何字符是非数字，则new Number(d)始终会返回NaN，而parseFloat(d)将忽略尾随的无效字符。

- M. Ahmad Zafar