javascript 字符串(String)类型转数字(Number)类型的几种方法

当前位置： 首页 » 记录 » javascript » javascript 字符串(String)类型转数字(Number)类型的几种方法

分类： javascript 1463阅读阅读模式

1、转换函数

JS 提供了 parseInt() 和 parseFloat() 两个转换函数。parseInt() 把值转换成整数，parseFloat 把值转换成浮点数。

只有对 String 类型调用这两个函数才能正确运行；对其他类型返回的都是 NaN(Not a Number) 。

如下：

  1. parseInt("0xA"); // 10
  2. parseInt("12.34"); // 12
  3. parseInt("12.3.5"); // 12
  4. parseInt("123darlang"); // 123
  5. parseInt("darlang"); // NaN
  6. parseInt("darlang123"); // NaN

parseInt() 方法还有基模式，可以把二进制、八进制、十六进制等（2-36进制）的字符串转换成整数。基是由 parseInt() 方法的第二个参数指定的。

如下：

  1. parseInt("16", 8); // 14 (1*8^1+6*8^0)
  2. parseInt("10F", 8); // 8 「F被干掉了」
  3. parseInt("10", 2); // 2 (1*2^1+0*2^0)
  4. parseInt("darlang",16); // 218 = da 「rlang被干掉了」
  5. parseInt("10", 10); // 10

由于 parseInt() 的特性，总会从左往右拿符合的值。

如 8/10 进制时，它会从左往右拿值数字的值，字母是无效的，如果都没有符合的值，就会返回 NaN 。这就是为什么 10F 只返回 10 的值。

而当 16 进制时，它会从左往右拿值数字以及A-F的值，其他字母是无效的，如果都没有符合的值，就会返回 NaN 。这就是为什么 darlang 只返回 da 的值，因为碰到了 r ，识别到时无效的，就终止了寻值并返回 da 的有效转换值 218 了。

还有个值得注意的是，如果为 10 进制时，数字前带有 0 可能会被意外的转换成 8 进制。

如下：

  1. parseInt("10"); // 10
  2. parseInt("010"); // 8
  3. parseInt("010", 8); // 8
  4. parseInt("010", 10); // 10

parseFloat() 方法与 parseInt() 方法的比较相似。不同之处在于 parseFloat() 处理字符串必须以十进制形式表示浮点数，同时它没有基模式。

拿第一个示例用换成 parseFloat ，如下：

  1. parseFloat("0xA"); // 0
  2. parseFloat("12.34"); // 12.34
  3. parseFloat("12.3.4"); // 12.3
  4. parseFloat("123darlang"); // 123
  5. parseFloat("darlang"); // NaN
  6. parseFloat("darlang123"); // NaN

可以看出，字母完全不起作用了，浮点数只取有效值，如 12.3.4 后面这个 .4 明显的不是有效的值，也就是说 parseFloat() 只会去第一个小数点后面的有效数字。

 

2、强类型转换

js 中有三个强类型转换的方法，分别是 Number() 转换为数字， String() 转换为字符串， Boolean() 转化为布尔值。

本节讲的是 Number() 这个方法，它将任何合法的数字字符串(String)转为数字(Number)类型。

如下：

  1. Number(12);// 12
  2. Number("12");// 12
  3. Number("12.34");// 12.34
  4. Number("12.3.4");// NaN
  5. Number("Infinity");// Infinity
  6. Number();// 0
  7. Number('0x11');// 17
  8. Number('');// 0
  9. Number(false);// 0
  10. Number(true);// 1
  11. Number(undefined);// NaN
  12. Number(null);// 0
  13. Number([]);// 0
  14. Number([12]);// 12
  15. Number('darlang');// NaN
  16. Number(new Object());// NaN

 

根据代码运行结果，越看越不对劲是不，不是说好的合法的数字字符串转换吗？

其实，合法数字字符串包含 16 进制、布尔值（0代表false、1代表true）、无穷数等这些都是合法的数字。

好吧，勉强的说法，但其中的数组空数组 js 会转为 0 ，数组中的数字转为数值，这个数组只能存在一个值，如 [12,34] 这种直接返回 NaN  ，打扰了。

对于处理多位小数点与 parseFloat() 相类似，会直接返回 NaN 。

undefined 的处理，理论来说应该是 false => 0 会返回 0 ，其实不是，参考JS规范中的这节：传送门==>The Abstract Equality Comparison Algorithm

 

3、弱类型转换

弱类型转换总的来说就是通过算术进行类型的转换，这个方法不推荐。

在类型转换时，既然是“弱”，说明会容易出错，如下：

  1. console.log('1234'-0,typeof('1234'-0));// 1234,number
  2. console.log('12.4'+0,typeof('12.4'+0));// 12.40,string
  3. console.log('1234'*1,typeof('1234'*1));// 1234,number
  4. console.log('1234'-0,typeof('1234'-0));// 1234,number
  6. console.log('1234'-1,typeof('1234'-1));// 1233,number
  7. console.log('12.4'+1,typeof('12.4'+1));// 12.31,string
  8. console.log('1234'*1,typeof('1234'*1));// 1234,number
  9. console.log('1234'-1,typeof('1234'-1));// 1233,number
  11. console.log('darlang'-0,typeof('darlang'-0));// NaN,number
  12. console.log('darlang'+1,typeof('darlang'+1));// darlang1,string
  13. console.log('darlang'*1,typeof('darlang'*1));// NaN,number
  14. console.log('darlang'-1,typeof('darlang'-1));// NaN,number

在类型转换的时候，遇到小数时并不能转为数值，遇到字母时，如 + 号会变成连接符，直接连接二者。

 

参考：

https://juejin.im/post/5b076c006fb9a07aa43c9fda

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number

JavaScript 类型转换 https://www.runoob.com/js/js-type-conversion.html

JavaScript parseInt() 函数 http://www.w3school.com.cn/js/jsref_parseInt.asp

提示：回复可见的文章，回复评论成功后，需要刷新页面才能看到被隐藏的内容！
永久固定短链接地址：
本文由大朗编写，如有错漏或其他不当，请在下方留言，欢迎指正。

相关文章

评论一下

相关评论 当前评论 1 条 [ 游客 0 | 博主 1 ]

  1. 大朗说道：
    2019年7月19日 11:24

    你好，测试回复

    回复