资讯专栏INFORMATION COLUMN

Javascript把数字从string变为number的5种方式

dabai / 1412人阅读

摘要:很多时候,我们的数字是字符串的形式的,如,它们可能是从输入框中获取,可能是来自后端的接口。我们有义务把他们变成整型。下面介绍几种方案这是就有的语法了,用法版本发展到的时候,被移到中。遇到浮点数时,小数部分被丢弃。遇到非法字符,直接被转换成。

很多时候,我们的数字是字符串的形式的,如:"1", "3", ["2", "4"],它们可能是从输入框 中获取,可能是来自后端的接口。我们有义务把他们变成整型。下面介绍几种方案

1、parseInt

这是es3就有的语法了,用法:

parseInt("123"); // 123  => number

js版本发展到es6的时候,parseInt被移到Number中。当然了,原来的parseInt可以继续使用

Number.parseInt("123"); // 123  => number

加入数字中带有非数字的字符,那么第一个出现非法字符的地方将会被截断

Number.parseInt("1239y93p21"); // 1239  => number
2、parseFloat

和parseInt差不多,但parseFloat主要针对浮点数的转换

parseFloat("123");          // 123  => number
Number.parseFloat("123");   // 123  => number

Number.parseFloat("123.4"); // 123.4 => number

同样有截断非法字符的规则

Number.parseInt("1239.34y93p21");     // 1239.34  => number
Number.parseInt("12 39.34y93p21");    // 12  => number
3、Number

es6新出的接口,可以直接使用,并且对浮点数也是有效的

Number("123");     // 123  => number
Number("123.4");   // 123.4 => number

与parse*()不同,Number处理时,遇到非法字符,直接NaN了,注意:NaN的类型也是number。

Number("123b");     // NaN  => number
Number("123.4b");   // NaN  => number
4、乘法+减法

是的,直接乘以1就行了

"123" * 1;     // 123  => number
"123.4" * 1;   // 123.4 => number

‘123’ - 0;    // 1234 => number
"123.4" - 0;   // 123.4 => number

遇到非法字符,也是直接NaN了。

"123b" * 1; // NaN  => number

注意:加法是不能转换类型的呢,会被当成字符串拼接:

"123" + 0; // ’1230‘  => string
5、按位或

这就是二进制方面的处理了,但是只能处理整数。遇到浮点数时,小数部分被丢弃。遇到非法字符,直接被转换成0。因为按位或会将数字转换成带符号的32位整数,多余的位数会被直接丢弃;所以按位或支持的整数范围是[pow(-2, 31), pow(2, 31) - 1]

"123" | 0;           // 123  => number

"123.4" | 0;         // 123 => number
"123rd" | 0;         // 0 => number

a = Math.pow(2, 31) // 2147483648 <=> 10000000000000000000000000000000

a | 0               // -2147483648 => number
(a - 1) | 0         // 2147483647 => number

为什么整数转为负数了呢,因为带符号二进制中,最高位(第32)是1,代表负数


题外话

对于字符串数组的转换,可以利用Number的特性

["1", "2", "3"].map(Number)  // [1, 2, 3] => number[]

还有其他的吗?如果有补充欢迎留言。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/108007.html

相关文章

  • JavaScript-数据类型转换

    摘要:通过使用的方式获取对象的数据类型,包括以下类型。该函数指定字符串中的首个字符是否是数字。 一、动态类型语言 JavaScript是一种动态类型语言(dynamically typed language)。这意味着你声明变量时可以不必指定数据类型,而数据类型会在脚本执行时根据需要自动转换。 1.1 定义变量 showImg(https://segmentfault.com/img/bV6...

    wangxinarhat 评论0 收藏0
  • 通过一张简单图,让你彻底地、永久地搞懂JS==运算

    摘要:一有和无在图中,值的六种类型用蓝底色的矩形表示。想一下在语言中,根本没有布尔类型,通常用来表示逻辑真假的正是整数和。根据图,需要将布尔类型转为数字类型,而转为数字的结果是,所以表达式变为两个操作数变成了对象类型数字类型。 大家知道,==是JavaScript中比较复杂的一个运算符。它的运算规则奇怪,容易让人犯错,从而成为JavaScript中最糟糕的特性之一。 在仔细阅读了ECMASc...

    testbird 评论0 收藏0
  • js温故而知新5——学习廖雪峰js教程

    摘要:表示行的结束,表示必须以数字结束。用表示的就是要提取的分组。方法在匹配成功后,会返回一个,第一个元素是正则表达式匹配到的整个字符串,后面的字符串表示匹配成功的子串。贪婪匹配需要特别指出的是,正则匹配默认是贪婪匹配,也就是匹配尽可能多的字符。 对象 typeof 123; // number typeof NaN; // number typeof str; // string type...

    mayaohua 评论0 收藏0
  • 有关javascript强制转换不得不说故事

    摘要:我们首先了解一下中有关类型转换的知识。新增类型抛出异常从列表可以明显看到少了一个类型转换为的规则。这里要强调一点第二个表达式没有涉及到强制类型转换。如果文中有错误或者有某些强制转换的情形没有涉及到请及时留言告知,我会修改并补充进去。 javascript是一门非常奇特的语言,它有时候奇特的会让人怀疑人生。比如让我们看一下下面的一些奇葩例子: false == 0 ...

    xcold 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<