首页 > JavaScript 阅读:655

JS类型转换(强制类型转换+隐式类型转换)

JavaScript  中有五种基本数据类型(其中包括 String、Number、Boolean、Function、Symbol)、三种对象类型(其中包括 Object、Date、Array)和两种特殊类型(其中包括 Null、Undefined)。不同的类型之间运算需要先对数据的类型进行转换,类型转换是将一种数据类型转换为另一种数据类型的过程,在日常开发中,我们会经常用到。

在 JavaScript 有两种类型转换的方式,分别是隐式类型转换和强制类型转换(也叫显式类型转换)。

1. JS 隐式类型转换

隐式转换就是自动转换,通常发生在一些数学运算中。因为 JavaScript 是一种弱类型的语言,在一个表达式中,运算符两边的类型可以不同(比如一个字符串和一个数字相加),JavaScript 解释器会在运算之前将它们的类型进行转换,如下所示:
var str = "http://c.biancheng.net/";
var num = 123;
var res = str + num;
document.write(typeof res);  // 输出:string
document.write(res);         // 输出:http://c.biancheng.net/123
通过运行结果可以看出,将一个字符串与一个数字相加,会得到一个字符串类型的值。如果是在 C语言或者 Java 语言中的话,上面的运算会因为运算符两边的数据类型不一致而导致报错,但在 JavaScript 中则不会,因为在运算之前 JavaScript 解释器会将上面的 num 变量隐式的转换为字符串类型,之后再进行运算。

JavaScript 中,表达式中包含以下运算符时,会发生隐式类型转换:
  • 算术运算符:加(+)、减(-)、乘(*)、除(/)、取模(%);
  • 逻辑运算符:逻辑与(&&)、逻辑或(||)、逻辑非(!);
  • 字符串运算符:+、+=。

示例代码如下:
document.write("3" - 2);           // 输出:1
document.write("3" + 2);           // 输出:"32"
document.write(3 + "2");           // 输出:"32"
document.write("3" * "2");         // 输出:6
document.write("10" / "2");        // 输出:5
document.write(1 + true);          // 输出:2
document.write(1 + false);         // 输出:1
document.write(1 + undefined);     // 输出:NaN
document.write(3 + null);          // 输出:3
document.write("3" + null);        // 输出:"3null"
document.write(true + null);       // 输出:1
document.write(true + undefined);  // 输出:NaN
通过运行结果可以得出:
  • 字符串加数字,数字会转换为字符串;
  • 数字减字符串,字符串会转换为数字,如果字符串无法转换为数字(例如"abc"、"JavaScript"),则会转换为 NaN;
  • 字符串减数字,字符串会转换为数字,如果字符串无法转换为数字,则会转换为 NaN;
  • 乘、除运算时,也会先将字符串转换为数字。

2. JS 强制类型转换

与隐式类型转换相反,强制类型转换需要手动进行,在 JavaScript 中,强制类型转换主要是通过调用全局函数来实现的,例如 Number()、Boolean()、parseInt()、parseFloat() 等。

1) 使用 Number() 函数

Number() 函数的语法格式如下:

Number(value);

示例代码如下:
document.write(Number("10.5"));  // 输出:10.5
document.write(Number(true));    // 输出:1
document.write(Number(false));   // 输出:0
document.write(Number(null));    // 输出:0
在使用 Number() 函数时,有以下几点需要注意:
  • 如果参数中只包含数字,将转换为十进制数字,忽略前导 0 以及前导空格,如果数字前面有负(-)号,那么-会保留在转换结果中,如果数字前面有加(+)号,转换后会删掉+号;
  • 如果参数中包含有效浮点数字,将转换为对应的浮点数字,忽略前导 0 以及前导空格,同样对于数字前的正负号,会保留负号忽略正号;
  • 如果参数中包含有效的十六进制数字,将转换为对应大小的十进制数字;
  • 如果参数为空字符串,将转换为 0;
  • 如果参数为布尔值,则将 true 转换为 1,将 false 转换为 0;
  • 如果参数为 null,将转换为 0;
  • 如果参数为 undefined,将转换为 NaN;
  • 如果参数为 Date 对象,将转换为从 1970 年 1 月 1 日到执行转换时的毫秒数;
  • 如果参数为函数、包含两个元素以上的数组对象以及除 Date 对象以外的其他对象,将转换为 NaN;
  • 如果在参数前面包含了除空格、+-以外的其他特殊符号或非数字字符,或在参数中间包含了包括空格、+-的特殊符号或非数字字符,将转换为 NaN。

2) 使用 parseInt() 函数

parseInt() 函数的语法格式如下:

parseInt(string, radix);

其中 string 为要转换的值,如果参数不是一个字符串,则会先将其转换为字符串,字符串开头的空白将会忽略;radix 为一个可选参数,表示字符串的基数,取值范围在 2 到 36 之间,例如将 radix 参数设置为 16,则表示将 string 转换为一个十六进制数。

在使用 parseInt() 函数时,有以下几点需要注意:
  • 解析字符串时,会忽略字符串前后的空格,如果字符串第一个字符为负号(-),那么负号会保留在转换结果中,如果字符串第一个字符为正号(+),那么转换后将忽略正号;
  • 如果字符串前面为除空格、正号(+)、负号(-)以外的特殊符号或者除 a~f(或 A~F)之外的非数字字符,那么字符串将不会被解析,返回结果为 NaN;
  • 在字符串中包含空格、小数点(.)等特殊符号或非数字的字符时,解析将在遇到这些字符时停止,并返回已解析的结果;
  • 如果字符串是空字符串,返回结果为 NaN。

示例代码如下:
document.write(parseInt("1101",2));   // 输出:13
document.write(parseInt("a37f",16));  // 输出:41855
document.write(parseInt("123"));      // 输出:123
document.write(parseInt("  123"));    // 输出:123

3) 使用 parseFloat() 函数

parseFloat() 函数的语法格式如下:

parseFloat(string);

其中 string 为要被转换为浮点数的值,如果转换失败,则会返回 NaN。

在使用 parseFloat() 函数时,有以下几点需要注意:
  • 如果在解析的过程中遇到了正号(+)、负号(-)、数字(0-9)、小数点(.)、或科学计数法中的指数(e 或 E)以外的字符,则会忽略该字符以及之后的所有字符,并返回解析到的浮点数;
  • 解析过程中若遇到多个小数点,则会在解析到第二个小数点时停止,并返回第二个小数点之前的解析结果;
  • 解析过程中会忽略参数开头或末尾的空白字符;
  • 如果参数的第一个字符不能被解析为数字,则会返回 NaN。

示例代码如下:
document.write(parseFloat("312.456"));  // 输出:312.456
document.write(parseFloat("-3.12"));    // 输出:-3.12
document.write(parseFloat("+3.12"));    // 输出:3.12
document.write(parseFloat(".12"));      // 输出:0.12

关注微信公众号「站长严长生」,在手机上阅读所有教程,随时随地都能学习。本公众号由C语言中文网站长运营,每日更新,坚持原创,敢说真话,凡事有态度。

魏雪原二维码
微信扫描二维码关注公众号