专栏名称: 众成翻译
翻译,求知的另一种表达
目录
相关文章推荐
Linux就该这么学  ·  printf 打印输出时 \ n 和 \r 的区别 ·  21 小时前  
Linux就该这么学  ·  熬夜修网成常态?开源网络运维助手来拯救你 ·  昨天  
Linux就该这么学  ·  某运维修不好 “ 打印机 ” ... ·  昨天  
Linux就该这么学  ·  不止是操作系统!Linux ... ·  2 天前  
Linux就该这么学  ·  开源装机工具 Ventoy 更新 ... ·  2 天前  
51好读  ›  专栏  ›  众成翻译

JavaScript 字符串转数字:陷阱(示例)

众成翻译  · 掘金  ·  · 2021-02-07 18:32

正文

阅读 15

JavaScript 字符串转数字:陷阱(示例)

译者:陈龙20155

原文链接

有很多种方式可以将字符串转为数字。我能想到的方式就至少有5种!

parseInt(num); // 默认方式 (没有基数)
parseInt(num, 10); // parseInt 使用基数 (十进制)
parseFloat(num) // 浮点型
Number(num); // Number 构造函数
~~num // 按位取反
num / 1 // 被 1 除
num * 1 // 被 1 乘
num - 0 // 减 0
+num // 一元操作 ""+""

复制代码

该使用哪种方式?什么时候?为什么?这得分析每一种方式和使用它们时常见的陷阱。

根据 JsPerf.com 上的 benchmarks 一组测试表明,大多数浏览器都对 ParseInt 做过优化。虽然它可能是最快的一种方式,但是有可能会引起以下几种错误:

parseInt('08') // 在一些老的浏览器里会返回 0 
parseInt('44.jpg') // 返回 44

复制代码

parseInt:总是使用基数 = parseInt(num, 10);如果你不想让它从字符里面推断数值,就不要使用它。

PareseFloat 又如何呢?它在不处理 16 进制数字的时候,都发挥的很好;例子:

parseInt(-0xFF) // returns -255
parseInt(""-0xFF"") // returns -255
parseFloat(-0xFF) // returns -255
parseFloat(""-0xFF"") // returns 0

复制代码

(注, 一个负 16 进制数字符串是比较特殊的例子,当你在应用中解析它的时候,可能会导致意想不到的错误。 永远记得在应用中检查 NaN 值,以避免出现意外。)

另外, 当数字中含有字符时它会产生跟 parseInt 一样的错误:

`parseFloat('44.jpg') // returns 44`

复制代码

**parseFloat: 处理 16 进制数字的时候需要注意;如果你不想让它从字符里面推断数值,就不要使用它。""

另外一种方法是 “按位取反” (~)。您仅可以使用它将字符串转换为整型,而不能转为浮点型数字。它比较好的一面是,当碰到非数字字符的时候,它会返回 0。

~~1.23 // returns 1
~~""1.23"" // returns 1
~~""23"" // returns 23
~~""Hello world"" // returns 0

复制代码






请到「今天看啥」查看全文