数据类型转换

源码下载

  先借一个语句let a = 5 + 5.2;引入本节课内容,5是一个整型数据,5.2是一个浮点数, 当Javascript解释器执行该语句的时候会把5先转化为浮点数5.0然后在与5.2求和。CPU操作内存中的数据进行计算的时候, 要保证数据类型一样,比如与上面语句类似的情况let x = 12 + "abc",数字与字符串进行+运算,首先解释器把12数字类型转为 字符串类型"12"然后执行运算,执行结果是"12abc"。一般情况下,数据类型的转换通常是由解释器或编译系统自动管理实现,不需要程序员参与。 不过这并不意味着写程序的时候不需要注意数据类型,虽然在Javascript语言中一个var或let关键字搞定变量声明,但是随着深入学习,有必要了解Javascript数据类型转换的机制, 除了上面两个语句中的隐式变换,也有程序员编程可以参与的强制变换操作。

  通过下面一个例子来学习注意数据类型转换有什么用途。

8        let T = new Date();//创建Date对象
9        second = T.getSeconds();//Date对象执行getSeconds()方法返回当前时间的秒针时间
10       document.write(typeof second);  //判断second数据类型,返回number
11       document.write("<br>");
12       if(second < 10){        //判断秒针时间大小是否小于10s
13           document.write("0" + second);  //时间值小于10的时候,时间值前面补0字符
14           document.write("<br>");
15           document.write(typeof ("0" + second));  //判断数据类型,返回string
16           document.write("<br>");
17       }
18       if(second >= 10){
19           document.write(second);//秒针时间大于10,直接显示即可
20       } 

体验测试

  测试上面代码的时候,先查下你的电脑此时秒针时间,分别在小于和大10s测试两次,观察显示结果。

代码解析

  先来说下第九行代码使用的getSeconds()方法,如果对Date对象有一定了解,getSeconds()方法的意思是从Date对象获得当前时间的秒针时间,返回的结果是一个number数据类型。 当时间是09:12:09,返回结果数字9,当时间是09:12:23,返回结果数字23,直接用document.write()可以把返回数据显示在页面上,如果返回秒针时间是9,那么页面显示9,那么如何显示09,对于23这种数字数据 没问题。如果你使用数字0加返回的数字9,结果仍然是9,这时候需要把9先转化为字符串格式,再使用一个字符串格式的"0",合并字符串返回新的字符串。这时候利用编程语言的隐式转换特性就可以,把数字0用引号标识 "0",再与数字秒针时间相加,查看第15行代码。

隐式转换

  不用人参与,系统自动转换数据类型的情况称为隐式转换,在不同的语言中都有体现。

  运算符==比较隐式转换后的数据是否相等,运算符===会比较隐式转换之前的数据类型。

a == b返回true列举

a b
true 1
false 0
"12" 12
"14.5" 14.5

显式转换

  比如要在页面上显示一系列数字构成的数学表达式,就要把所有数字转换为字符串来处理。 除了隐式转换,Javascript语言也提供了一系列方法函数,像这种强制转换数据类型的情况称为显式转换。

String()

  作用是把任何数据类型的数据作为String()方法的参数,执行后返回该数据的string类型数据。 属于全局对象,全局对象并不是像Math等对象在Javascript语言是存在,Javascript一些可以直接调用的函数都可以归类全局对象的方法。 调用这些方法的时候不需要在方法前面使用运算符点.。

  测试代码如下,把数字变量a作为函数String()参数即可,执行的过程变量a不变化,只是返回一个字符串"123"。 很多教程往往会用描述String()的作用是把对象数据转化为字符串,语言描述上有误导性。

22       //全局对象方法String,把数字转为字符串
23       let a = 123;
24       let b =String(a);
25       document.write(typeof b);

Number()

  Number和String一样属于全局对象,不需要借助对象直接调用,参数可以是任何类型数据,返回结果是数字类型数据或NaN。 比如Number("天下"),返回的是NaN,因为该字符串无法用数字描述,如果是Number("123"),就会返回数字123.

  document.write(Number("天下"));//返回NaN
  document.write(Number([12]));//返回12
  document.write(Number([12,12]));//返回NaN
  document.write(Number("12.5"));//返回12.5

几种典型数据作为Number()参数,返回结果列表

参数 结果 解释
true 1 true是布尔类型的值
false 0 false是布尔类型的值
undefined NaN 无法表示的数字都用NaN表示,undefined表示变量未定义,毫无疑问返回NaN
null 0 null代表空指针,没有数据,所以返回NaN

Boolean()

  Number与Number()、String()使用方法类似,返回的数据是布尔值,true、false

参数 结果 解释
"" false 空字符串
0 false 0与false隐式转换相等
12 true 非0数字返回true