JavaScript入门教程

JavaScript简介
JavaScript语法基础
JavaScript流程控制
JavaScript函数
面向对象编程
JavaScript事件
JavaScript DOM
正则表达式
JavaScript BOM
AJAX

专题分析

浏览器兼容性
JS优化
Web前端开发规范
编辑器推荐
总结和笔记

学习助手

对象参考手册
ECMAScript分析
数据中心
QQ交流群

JavaScript数值转换(非数值转换为数值)

在JavaScript中,有3个函数可以把非数值转换为数值,这三个函数分别是:Number()parselnt()parseFloat()。第一个函数,即转型函数 Nurnber() 可以用于任何数据类型,而另两个函数则专门用于把字符串转换成数值。这3个函数对于同样的输入会返回不同的结果。

Number() 函数

Nurnber() 函数的转换规则如下:
  1. 如果是 Boolean 值,true 和 false 将分别被转换为 1 和0;
  2. 如果是数字值,只是简单的传入和返回;
  3. 如来是null 值,返回 0;
  4. 如果是 undefined,返回NaN ;
  5. 如果是字符串,遵循下列规则:
    • 如果字符串中只包含数字,则将其转换为十进制数值,即"1"会变成1 , "123"会变成123,而"011"会变成11(注意,前导的0被忽略了);
    • 如果字符串中包含有效的浮点格式, 如"1.1",则将其转换为对应的浮点数值(同样,也会忽略前导零);
    • 如果字符串中包含有效的十六进制格式,例如"0xf",则将其转换为相同大小的十进制整数值;
    • 如果字符串是空的(不包含任何字符) ,则将其转换为0;
    • 如果字符串中包含除上述格式之外的字符,则将其转换为 NaN。
  6. 如果是对象,则调用对象的 valueOf() 方法,然后依照前面的规则转换返回的值。如果转换的结果是 NaN,则调用对象的 toString() 方法,然后再次依照前面的规则转换返回的字符串值。

根据这么多的规则,使用 Nurnber() 把各种数据类型转换为数值确实有点复杂。下面还是给出几个具体的例子吧:
var num1 = Number("Hello world!");  // NaN
var num2 = Number(" ");  // 0
var num3 = Numberl("000011");  // 11
var num4 = Number(true);  // 1

首先,字符串"Hello world! "会被转换为 NaN,因为其中不包含任何有意义的数字值;空字符串会被转换为 0;字符串"000011"会被转换为 11 ,因为忽略了其前导的0;最后,true 值被转换为1。

parseInt() 函数

由于 Number() 函数在转换字符串时比较复杂而且不够合理,因此在处理整数的时候更常用的是 parseInt() 函数。parselnt() 函数在转换字符串时,更多的是看其是否符合数值模式,它会忽略字符串前面的空格,直至找到第一个非空格字符;如果第一个字符不是数字字符或者负号,parseInt() 就会返回 NaN;也就是说,用parselnt() 转换空字符时会返回 NaN(Nurnber() 对空字符返回 0); 如果第一个字符是数字字符,parselnt() 会继续解析第二个字符,直到解析完所有后续字符或者遇到了一个非数字字符。例如,"1234blue"会被转换为1234 ,因为"blue"会被完全忽略;类似地,"'22.5"会被转换为22 ,因为小数点并不是有效的数字字符。

如果字符串中的第一个字符是数字字符,parselnt() 也能够识别出各种整数格式(即前面讨论的十进制、八进制和十六进制数) 。也就是说,如果字符以"0x"开头且后跟数字字符,就会将其当作一个十六进制整数;如果字符串以"0"开头且后跟数字字符,则会将其当作一个八迸制数来解析。

为了更好地理解 parseInt() 函数的转换规则,下面给出一些例子:
var num1 = parselnt ("1234blue") ;  // 1234
var num2 = parselnt (" ") ;   // NaN
var num3 = parselnt ("0xA") ;  // 10(十六进制数)
var num4 = parseInt(22.5);   // 22
var num5 = parselnt ("070") ;  // 56(八进制数)
var num6 = parselnt("70");  //70(十进制数)
var num7 = parselnt ("0xf") ;  // 15(十六进制数)
理解这几个例子时,最关键的是要注意 parseInt() 解析"070" 和 "70" 的不同方式。此时"070"中的前导零表示这是一个八进制(而非十进制)格式的字符串,因而结果是56(注意这个结果与调用 Number() 函数不同),而"70"呢,由于它没有前导的零,因此就被转换成了 70。为了消除在使用 parselnt() 函数时可能导致的上述困惑,JavaScript也为这个函数提供了第二个参数:转换时使用的基数(即多少进制)。

如果知道被解析的是十六进制格式的字符串,那么指定基数16 作为第二个参数,可以保证得到正确的结果,例如:
var num = parselnt("0xAF", 16);   //175
实际上,如果指定了16 作为第二个参数,字符串可以不带前面的"0x",如下所示:
var num1 = parseInt( 'AF' , 16);   //175
var num2 = parselnt ("AF") ;   // NaN
这个例子中的第一个转换成功了,而第二个则失败了。差别在于第一个转换传入了基数,明确告诉 parselnt () 要解析一个十六进制格式的字符串;而第二个转换发现第一个字符不是数字字符,因此就自动终止了。指定基数会影响到转换的输出结果。例如:
var num1 = parselnt ("10", 2);  // 2(按照二进制解析)
var num2 = parseInt("10", 8);  // 8(按照八进制解析)
var num3 = parselnt("10", 10);  // 10(按照十进制解析)
var num4 = parselnt("10", 16);  // 16(按照十六进制解析)
由于不指定基数则意味着让 parselnt() 决定如何解析输入的字符串,因此为了避免错误的解析,我们建议无论在什么情况下都明确指定基数一一特别是在像下面这样处理八进制值的情况下:
var num1 = parselnt ("010");   // 8(按照八进制解析)
var num2 = parselnt ("010", 8);   // 8(按照八进制解析)
var num3 = parselnt ("010", 10);  //10(按照十进制解析)
在这个例子中,"010"会因第二个参数不同而被转换成不同的值。第一行的转换很直观,即让 parselnt() 决定如何转换。由于第一个字符是"0"后面也是数字字符,因而 parselnt() 假设它是一个八进制数。实际上,parselnt() 的这个默认行为与第二行转换中明确指定了基数的行为是一致的。第三行传入的基数是10,因此 parselnt() 就会忽略字符串中所有前导的"0",而只解析其余的数字字符。

多数情况下,我们要解析的都是十进制数值,因此始终将10作为第二个参数是非常必要的。

parseFloat() 函数

与 parseInt () 函数类似,parseFloat () 也是从第一个字符(位置0)开始解析每个字符。而且也是一直解析到字符串末尾,或者解析到遇见一个无效的浮点数字字符为止。也就是说,字符串中的
第一个小数点是有效的,而第二个小数点就是无效的了,因此它后面的字符串将被忽略。举例来说,"22.34.5"将会被转换为22.34 。

除了第一个小数点有效之外, parseFloat () 与 parselnt() 的第二个区别在于它始终都会忽略前导的零。parseFloat() 可以识别前面讨论过的所有浮点数值格式,也包括十迸制整数格式,但十六进制格式的字符串则始终会被转换成0。由于 parseFloat() 只解析十进制值,因此它没有用第二个参数指定基数的用法。最后还要注意一点:如果字符串包含的是一个可解析为整数的数(没有小数点,或者小数点后都是零),parseFloat() 会返回整数。以下是使用 parseFloat() 转换数值的几个典型示例:
var num1 = parseFloat ("1234blue") ;  // 1234(整数)
var num2 = parseFloat("0xA");   // 0
var num3 = parseFloat("22.5");  // 22.5
var num4 = parseFloat("22.34.5");  // 22.5
var num5 = parseFloat("0908.5");   // 908
var num6 = parseFloat("3.125e7");   // 31250000