数据类型回顾——NaN和isNaN—JS学习笔记2015-6-4（第48天）

1、什么是NaN？

not a number  不是数字，但是使用typeof检测可以看出它是数字类型；

也就是说它在JS中的数据类型当中，归属于number类型；

JS中的数据类型：number（NaN）、string、boolean、function、undefined、object（obj、[]、{}、null）

 

2、出现NaN时候说明什么呢？

说明进行了非法的运算操作

本身的特性  NaN的布尔值类型是false； 

                NaN和它本身都不相等；

 

3、什么是isNaN？

（不是个数字）

isNaN(); // 可以判断某些值是不是数字类型；

 非常讨厌数字，遇到数字后会返回false

其他都返回true;

isNaN(),它的内部调用的是Number()方法

比如：alert(isNaN(2));  // 返回false；

　　   alert(isNaN('Here I am')) // 返回 true;  因为这里Number()来转换，转换后不是数字

         alert(isNaN('250')) //   返回false ，这里Number()转换后是数字250，所以返回false；

         alert(isNaN(true)) // false

所以当Number()转不了的时候，返回NaN，就返回true

 

实例：（利用isNaN 判断类型）

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>无标题文档</title>
 6 
 7 <script>
 8 window.onload = function(){
 9    var alnp = document.getElementsByTagName('input');
10    var str = '';
11 
12    alnp[1].onclick = function(){
13        str = alnp[0].value;
14        // 属性操作我们发现，从HTML拿到内容，类型都是字符串；
15        // alert(typeof str); 这里判断出来都是字符串
16     if (isNaN(str)) {
17         alert(str + '不是数字');
18     }else{
19         alert(str + '是数字');
20     };
21 
22 
23    }
24 
25 }
26 
27 </script>
28 
29 </head>
30 
31 <body>
32 <input type="text">
33 <input type="button" value="判断是不是数字">
34 
35 </body>
36 </html>
View Code

 

实例二：判断QQ号是否正确（还差一个前导0的判断）

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>判断是否为合理的QQ号码</title>
 6 
 7 <script>
 8 window.onload = function(){
 9    var alnp = document.getElementsByTagName('input');
10    var str = '';
11 
12    alnp[1].onclick = function(){
13        str = alnp[0].value;
14        // 属性操作我们发现，从HTML拿到内容，类型都是字符串；
15        // alert(typeof str); 这里判断出来都是字符串
16     if (str === '') {
17 
18         alert('您没有输入内容');
19 
20     }else if(isNaN(str)){
21 
22          alert('您输入的不是数字')
23 
24     }else if(parseInt(str)!== parseFloat(str)){
25 
26          alert('您不可以输入小数，这不合法');
27 
28     }else if(str.length>=5 && str.length<10){
29 
30       alert('恭喜你，您输入的是有效的QQ号码')
31 
32     }else{
33 
34       alert('您的输入的数字必须在5位以上、10位以内');
35 
36     }
37    
38    }
39 
40 }
41 
42 </script>
43 
44 </head>
45 
46 <body>
47 <input type="text">
48 <input type="button" value="判断是不是有效QQ号码">
49 <p>
50   1、有没有输入<br />
51   2、输入的是不是数字<br />
52   3、不能有0在前面<br />
53   4、不能是小数<br />
54   5、输入的数字必须在5位以上、10位以内
55 </p>
56 
57 </body>
58 </html>
View Code

 

posted on 2015-06-04 23:59  张小国  阅读(255)  评论(0)  编辑  收藏  举报

导航