[JavaScript]-2-js变量与数据类型
引言
这篇文章介绍HTML文档中，JavaScript的变量声明与数据类型。
文章目录
0×1.变量的声明与规范
JavaScript中，变量的声明使用关键词var，并遵循下面这几点规则：
* 由字母、数字、下划线、$符号组成,且不能以数字开头;
* 不能是关键字和保留字,例如:for、while;
* 区分大小写;
下面而是一些符合规则的变量命名方式：
<script type="text/javascript"> var aUser="qingsword"; var bUser="qingsword.com"; var userPassword="123456"; </script>
下面而是一些不符合规则的变量命名方式：
<script type="text/javascript"> var 1aUser="qingsword"; var 2bUser="qingsword.com"; var &number=1; </script>
注：如果出现了不符合规范的js语法，或者不符合规范的变量命名，会在浏览器调试页面（火狐浏览器鼠标右键，检查，或F12），在调试页面的Console标签中可以看到具体的报错。
下面是js中几种变量的声明与调试方法：
<script type="text/javascript"> //声明两个变量，赋值，并进行运算 var xValue=100,yValue=200; var xValue=xValue+yValue; //方法一：通过弹窗显示运算结果 alert(xValue); //方法二：通过控制台显示运算结果（会出现在浏览器调试页面的Console标签中），这个功能通常用于代码调试 console.log(xValue,yValue); //通过document.write函数将变量值打印到页面上 document.write(xValue,"|",yValue); </script>
0×2.JS中常用的几种数据类型
JS中有六种常见的数据类型如下：
Number、String、Boolean、Undefined、Null 、Object；
* Number代表数值类型，例如：22，23，80，1433，3306，3389，0.233；
<script type="text/javascript"> //声明一个整形变量 var iNumber=3306; //声明两个浮点数 var fNumber1=0.1; var fNumber2=0.2; //对一部分浮点数的运算存在精度问题，例如0.1+0.2会等于0.300000x，不会等于0.3 //但是有一部分又不会出现这种问题，例如0.3+0.5会等于0.8 var fNumber3=fNumber1+fNumber2; //直接将fNumber3与0.3做比较，Console中会返回一个false console.log(fNumber3==0.3); //如果遇到这种精度问题，可以先将浮点数转换成整形计算，再转换回去，例如 var fNumber4=(fNumber1*10+fNumber2*10)/10; //true console.log(fNumber4==0.3); </script> //最好避免浮点数的加减法，如果一定要用，先转化成整形
* String代表字符串类型，例如："qingsword.com","www.qingsword.com","hello world"；
<script type="text/javascript">
//声明一个字符串变量
var iWebsite="qingsword.com";
//使用转义字符在控制台窗口打印出"Welcome to my web site 'qingsword.com'"
//加号可以用于字符串的拼接，在加号两边只要存在字符串，加号就用于字符串拼接，如果加号两边都是数字，就做加法运算
console.log("\"Welcome to my web site \'"+iWebsite+"\'\"");
</script>
//转义字符在PHP或JS文件中常用于对代码的简单加密，隐藏正真的代码内容
\xnn这种转义字符，其中n可以是0~F中的任意一个，代表十六进制ASCII编码，例如：\x41表示大写的A
//一些木马文件中，喜欢使用明文与ASCII十六进制编码混合的方式，如下
{"G\x4c\x4f\x42\x41\x4cS"}
//翻译过来就是
{"GLOBALS"}
\unnnn这种转义字符，其中的n可以是0~F中的任意一个，代表了Unicode编码，例如：\u03a3代表符号∑
//要特别注意JS或PHP文件中的这种混合编码方式存在的文件，除了能够用来隐藏真实意图之外，还能逃过杀毒软件的查杀
//获取字符串长度，通过length属性
console.log(iWebsite.length);
* Boolean包含真或假，例如：true，false；
<script type="text/javascript"> //声明一个Boolean变量，在js中还可以用1表示true，用0表示false var iBool=true; </script>
* Undefined就包含一个值：Undefined；
<script type="text/javascript"> //变量被声明但未赋值，默认就是undefined类型 var iUndefined=undefined; var aUndefined; </script>
* Null代表不存在的值（一个很尴尬的设计悖论）；
<script type="text/javascript"> //声明一个Null变量 var iNull=null; //undefined和null //单纯判断值是否相等，结果为true console.log(undefined==null); //如果使用三等号判断值和数据类型是否相等，结果为false console.log(undefined===null); </script>
* Object就代表可以保存多种数据的复杂Object对象；
<script type="text/javascript"> //声明一个Object对象 var iObject=new Object(); </script>
可以通过typeof来判断一个变量是哪种数据类型：
<script type="text/javascript"> var iObject=new Object(); var iWebsite="qingsword.com"; //下面两种写法都可以，在Console中打印出对应变量的值（也可以使用document.write打印到页面上） console.log(typeof(iObject)); console.log(typeof iWebsite); </script>
可以打开本页的浏览器调试器，查看Console中打印出的两个值，object和string，我在这一句的下方插入了一个script标签，与上面代码段中的内容一样。
注：null使用typeof输出会得到Object类型，除此之外，其他类型的变量都能返回对应的数据类型。
0×3.常用数据类型的相互转换
* 其他类型转字符串类型
<script type="text/javascript"> //定义两个整形 var aNum=233; var bNum=456 //下面这三种方法，都可以用于字符串转换，将整形转化成字符串类型 //使用加号给整形加上空字符串，也同样可以将整形转化成字符串类型 var aString=aNum.toString(); var bString=String(bNum); var cString=aNum+""; //在google浏览器控制台窗口中数字以蓝色显示，字符串以黑色显示 console.log(aNum); console.log(bNum); console.log(aString); console.log(bString); console.log(cString); //null与undefined这两种特殊的数据类型转化成字符串，只能通过String()方法 console.log(String(undefined)); console.log(String(null)); </script>
* 其他类型转字数值类型
//使用Number函数
<script type="text/javascript">
//分别定义了不同类型的变量
var aStr="233",bStr="qingsword.com",cNull=null,dUndefined=undefined,eTrue=true;
//方法一，通过Number函数，转换结果如下
//233,NaN,0,NaN,1
//null被转化成了0，非数字会被转化成NaN，NaN在js中是数值类型，当使用转换函数时，如果数据不能转化成数字，就会返回一个NaN数值类型，bool类型会被转化成1或0
console.log(Number(aStr));
console.log(Number(bStr));
console.log(Number(cNull));
console.log(Number(dUndefined));
console.log(Number(eTrue));
//特殊情况：NaN与自身以及任何数值类型都不相等
console.log(NaN==NaN); //false
console.log(NaN==233); //false
//判断数值类型是否为NaN，需要使用isNaN函数
console.log(isNaN(aStr)); //false
console.log(isNaN(Number(bStr))); //true
</script>
//使用parseInt函数 <script type="text/javascript"> var aStr="233.233",bStr="qingsword.com",cNull=null,dUndefined=undefined,eTrue=true; var aNum=12,afNum=233.999; //控制台返回结果如下 //233,NaN,NaN,NaN,NaN,12,233 //parseInt函数对无法转换的数据类型也同样返回NaN //对小数直接取整且不四舍五入 console.log(parseInt(aStr)); console.log(parseInt(bStr)); console.log(parseInt(cNull)); console.log(parseInt(dUndefined)); console.log(parseInt(eTrue)); console.log(parseInt(aNum)); console.log(parseInt(afNum)); </script>
//使用parseFloat函数 <script type="text/javascript"> var aStr="233.233",bStr="qingsword.com",cNull=null,dUndefined=undefined,eTrue=true; var aNum=12,afNum=233.999; var fStr="23qingsword.com",gStr="qingsword.com.23" //返回结果如下 //233.233,NaN,NaN,NaN,NaN,12,233.999,23,NaN //对首字母包含数字的字符串不论parseInt函数还是parseFloat函数都能将字符串前面的数字提取出来 //但是对字符串中间或者结尾包含数字的字符串，这两个函数无法处理，返回NaN console.log(parseFloat(aStr)); console.log(parseFloat(bStr)); console.log(parseFloat(cNull)); console.log(parseFloat(dUndefined)); console.log(parseFloat(eTrue)); console.log(parseFloat(aNum)); console.log(parseFloat(afNum)); console.log(parseFloat(fStr)); console.log(parseFloat(gStr)); </script>
//使用运算符进行转换
<script type="text/javascript">
var aStr="233.233";
console.log(aStr+0); //返回字符串233.2330
console.log(aStr-0); //返回数值233.233
console.log(+aStr); //返回数值类型233.233
console.log(-aStr); //返回数值类型-233.233
console.log(aStr*1); //返回数值类型233.233
console.log(aStr/1); //返回数值类型233.233
</script>
* 其他类型转布尔类型
//使用运算符进行转换
<script type="text/javascript">
var a = Boolean('0');
var b = Boolean(0);
var c = Boolean('1');
var d = Boolean(null);
var e = Boolean(undefined);
var f = Boolean(NaN);
console.log(a,b,c,d,e,f); //true false true false false false
// 0、''(空字符串) 、null、 undefined 、NaN 会转换成false 其它都会转换成true
</script>