JavaScript高级程序设计（第3版）学习笔记3 js简单数据类型

首页

web前端

js教程

JavaScript高级程序设计（第3版）学习笔记3 js简单数据类型_基础知识

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 05:49 PM

ECMAScript是一种动态类型的语言，构建于5种简单数据类型（Undefined、Null、Boolean、Number、String）和一种复杂数据类型（Object）的基础之上。这篇文章就来复习一下简单数据类型，我会尽量从编程实践的角度来描述，下面代码运行环境为FireFox 14.0.1。

简单数据类型

简单数据类型	取值
Undefined	undefined（只有一个值）
Null	null（只有一个值）
Boolean	true\|false（只有两个值）
Number	数值
String	字符串

　　首先需要说明的是，在ECMAScript中，上述5种简单数据类型，其中Boolean、Number、String都有同名的内置包装对象，而简单数据类型的字面值（变量）会根据情况自动包箱，从而可以直接调用方法，至于具体可以调用哪些方法，在讨论内置对象时再详细说明：

复制代码代码如下:

 
console.info(true.toString());//true,相当于使用Boolean()包装之后再调用 
console.info(Boolean(false).toString());//false，将false转换为Boolean类型值 
console.info(new Boolean(false).toString());//false，将false使用Boolean()包装 
console.info(false.toString());//false，相当于使用Boolean()包装之后再调用 
console.info('test'.toString());//test，相当于使用String()包装之后再调用 

try{ 
console.info(undefined.toString());//没有相应包装类型，抛出异常 
}catch(e){ 
console.info(e);//TypeError 
} 
try{ 
console.info(null.toString());//没有相应包装类型，抛出异常 
}catch(e){ 
console.info(e);//TypeError 
} 

var num = 4; 
console.info(num.toString());//4，可以直接在简单数值变量上调用方法，相当于使用Number()包装之后再调用 
//console.info(3.toString());//SyntaxError,语法错误不能使用try捕获，说明不能直接在数值字面量上调用 

其次说一下实际用的最多的数据转换：
　　（1）转换为Boolean：!!value
　　（2）转换为Number：+value
　　（3）转换为String：''+value
　　下面再具体说明5种简单数据类型：
1、Undefined类型
　　Undefined数据类型只有一个取值：undefined。
（1）所有未初始化的值都默认为undefined（也就没有必要把一个变量显示初始化为undefined了）。
（2）在函数作用域中，没有传入实际参数的函数形参为undefined。
（3）函数没有明确返回或者return;的时候，返回值为undefined。
（4）在ECMAScript中，规定null==undefined返回true，而null===undefined返回false。
（5）undefined相应的Boolean值为false。
（6）使用typeof作用于undefiend时，返回字符串'undefined'，作用于一个从未声明的“变量”时，也会返回'undefined'。
（7）undefined转换数值为NaN，转换字符串为'undefined'。

复制代码代码如下:

 
console.info(undefined===undefined);//true 
console.info(typeof undefined);//undefined 
console.info(typeof noDefined);//undefined，未定义的标识符，使用typeof也返回undefined，这也是未定义的标识符唯一可用的的操作符 
console.info(!undefined);//true，这里返回true，正是很多条件语句中判断变量是否初始化的基础 
console.info(!!undefined);//任何一个值，使用双重否定!!都会将其转换为相应的Boolean值，这里说明undefiend相应的Boolean值为false 
console.info(undefined==null);//ES中规定，null与undefined相等性测试返回true 
console.info(undefined===null);//但undefined与null毕竟是两个数据类型，使用全等比较时，返回false 
console.info(typeof undefined==undefined);//false，typeof undefined返回的是一个字符串'undefined'，所以这里输出false 
console.info(+undefined);//NaN,转换数值时为NaN 
console.info(''+undefined);//undefined，转换为字符串'undefined' 

2、Null类型
　　Null类型也只有一个值：null。
（1）对null值使用typeof时，返回字符串'object'。
（2）null相应的Boolean值为false。
（3）如果一个变量用于保存一个对象，建议初始化为null。
（4）null转换数值为0，转换字符串为'null'。

复制代码代码如下:

 
console.info(null===null);//true 
console.info(typeof null);//object 
console.info(!null);//true 
console.info(!!null);//false,说明null相应的Boolean值为false 
console.info(undefined==null);//true 
console.info(undefined===null);//false 
console.info(+null);//0，转换为数值0 
console.info(''+null);//null，转换为字符串'null' 

3、Boolean类型
　　Boolean类型只有两个值：true和false。
（1）虽然只有两个值，但是任何一种数据类型的值都能转换为与其相对应的Boolean值，转换方式主要有三种：
　　A、通过转型函数Boolean()转换
　　　　需要注意的是，当Boolean()作为转换函数时，会转换为一个与其相应的Boolean值，当作为构造函数时，会创建一个对象，而任意非空对象的Boolean值都是true，有时候这会造成误解，建议就是不使用Boolean()。对于String()、Number()也有类似情况。
　　B、通过双重否定!!操作符转换
　　C、通过隐式转换，比如一些条件语句中
（2）Boolean类型的true和false，使用typeof时，均返回字符串'boolean'。
（3）在转换为数值时，true和false分别转换为1和0，转换为字符串时，分别为'true'和'false'。

复制代码代码如下:

 
var value = 'test'; 
var empty = ''; 
console.info(!!value);//true 
console.info(!!empty);//false 
console.info(Boolean(value));//true 
console.info(Boolean(empty));//false 
console.info(!!value === Boolean(value));//true，说明两种转换方式等价 
console.info(!!empty === Boolean(empty));//true 
console.info(new Boolean(value));//Boolean对象，注意这里使用了new，会创建一个对象 
console.info(new Boolean(empty));//Boolean对象 
if(value){//隐式转换为true 
console.info(value);//test 
} 
if(empty){//隐式转换为false，不执行括号内部语句 
console.info('empty'); 
} 
if(new Boolean(empty)){//先创建对象，再隐式转换为true，会执行括号内部的语句 
console.info('empty');//empty 
} 
console.info(typeof true == 'boolean');//true 
console.info(+true);//1，一元操作符，转换为数值1 
console.info(+false);//0 
console.info(''+true);//true，重载后的+操作符，转换为字符串'true' 
console.info(''+false);//false 

具体的转换规则如下：

数据类型	转换为true的值	转换为false的值
Undefined	-	undefined
Null	-	null
Boolean	true	false
Number	任意非0数值（包括无穷大）	0和NaN
String	任意非空字符串	空字符串
Object	任意对象	-

4、Number类型

　　在ECMAScript中，没有单独的整型、浮点型，只有一个Number类型，使用IEEE754格式来表示（这种表示法在计算时会有舍入误差），在这里不去细究底层实现，这些东西在学校学C语言的时候已经很头痛了，不想再头痛一次。下面我把实际编程中用的最多的放到最前面来讲，这一般来说已经足够，对于不想被太边缘的细节所困扰的朋友，随时可以跳过后面关于Number的论述。

（1）数值转换：主要是下面的三个转换函数

Number()函数：和Boolean()类似，将数据转换成Number类型，和使用一元加操作符（+）作用相同，建议使用 + 操作符，比较简单。
parseInt()函数：解析整数，可以传入数据和进制，如parseInt('070',8)输出10进制的56。
parseFloat()函数：解析浮点数，只能接受一个参数，需要注意的是，如果被解析的数据结果是整数，会直接返回整数。

注：使用Number()和+转换时，true—>1，false—>0，undefined—>NaN，null—>0，空字符串—>0，非空字符串—>按数值解析。

复制代码代码如下:

 
var trueVal = true; 
var falseVal = false; 
var undef = undefined; 
var nullVal = null; 
var intVal = '1'; 
var floatVal = '1.0'; 
var strVal = 'test'; 
var empty = ''; 
console.info(Number(trueVal));//1 
console.info(Number(falseVal));//0 
console.info(Number(undef));//NaN 
console.info(Number(nullVal));//0 
console.info(Number(intVal));//1 
console.info(Number(floatVal));//1 
console.info(Number(strVal));//NaN 
console.info(Number(empty));//0 

console.info(+trueVal);//1 
console.info(+falseVal);//0 
console.info(+undef);//NaN 
console.info(+nullVal);//0 
console.info(+intVal);//1 
console.info(+floatVal);//1 
console.info(+strVal);//NaN 
console.info(+empty);//0 

console.info(parseInt(trueVal));//NaN 
console.info(parseInt(falseVal));//NaN 
console.info(parseInt(undef));//NaN 
console.info(parseInt(nullVal));//NaN 
console.info(parseInt(intVal));//1 
console.info(parseInt(floatVal));//1 
console.info(parseInt(strVal));//NaN 
console.info(parseInt(empty));//NaN 

console.info(parseFloat(trueVal));//NaN 
console.info(parseFloat(falseVal));//NaN 
console.info(parseFloat(undef));//NaN 
console.info(parseFloat(nullVal));//NaN 
console.info(parseFloat(intVal));//1 
console.info(parseFloat(floatVal));//1 
console.info(parseFloat(strVal));//NaN 
console.info(parseFloat(empty));//NaN 

说明：这些转换函数的行为可能会由于浏览器的不同实现而不同，建议在实际编程过程中对存有疑问的先自行编写测试。在《JavaScript高级程序设计（第3版）》中，这一节描述的也有很多地方和我实际运行的结果不同，比如原书说parseInt()只能解析字符串，但是下面的代码也可以运行：

复制代码代码如下:

 
var object = { 
value:1, 
toString:function(){ 
return this.value; 
} 
}; 
console.info(parseInt(object));//1 

（2）整数和浮点数：受C语言熏陶的人，肯定要固执的区分一下整数和浮点数吧！在ECMAScript中，他们没有预想的那么有差别，简单点，含有小数点且小数点后至少有一位不是0的数值就是浮点数，否则就是整数，比如1.01是浮点数，1.、1.00因为小数点后没有不是0的数，引擎会解析成整数1。你可能会设想两个整数相除结果也会取整吧，比如3 / 2 = 1，但是在ECMAScript中，不要担心这些，已经还原其数学属性了，你会发现 3 / 2 = 1.5了，这一点，在运算符相关部分还会再提及。

（3）进制：也称进位制，实际上就是进位（低位向高位）的方法，每种进制都有一个基数，当低位数值达到这个基数时，就向高位进1。在日常生活中，用的最多的自然是10进制，比如10角就进位为1元，在时间度量中，还有24进制（24小时为1天）、60进制（60秒为1分），在古代，也有使用16进制的（想一想半斤八两吧）。但是在计算机的处理中，由于电流只有通和不通两种状态，所以只能处理2进制数据，不过这对于自然人来说不好理解，于是又使用8进制、16进制作为10进制和2进制转换的中间状态。

　　在ES3中，可以使用8进制、10进制、16进制，但是在ES5中，8进制已经被禁用了。

　　8进制：以1位数字0开始，后面是8进制数字序列（0~7），如果数字超过了7，会忽略前导0而作为10进制处理，比如08会解析为10进制的数字8。

　　16进制：以1位数字0和1个字母x开始，后面是16进制数字序列（0-9a-fA-F）。

　　10进制：可以直接将所有数位一一写出来，也可以使用科学计数法（不明白？找一本中学数学教科书来看看吧）来表示。

（3）特殊值：在ECMAScript中，有2个特殊的数值NaN和Infinity需要注意一下，前者表示不是一个数值（Not a Number），后者表示不在表示范围内的数值，还可以使用正负号表示方向。对于这两个特殊值，这里不去考察具体的运算规则（你若感兴趣，可以自行测试，我在下面也会举一些例子），只做如下两点说明：

　　A、不能用val==NaN来判断一个变量是否为NaN，而要使用全局的isNaN()函数，该函数接受一个参数，当参数可以转换为数值时返回true，否则返回false。

　　B、尽量不要使用val==Infinity判断是否超出范围，而使用全局的isFinite()函数，该函数接受一个参数，当参数数值处于表示范围内时返回true，否则返回false。这里所说的表示范围是指从Number.MIN_VALUE到Number.MAX_VALUE，另外，在Number里面，还有属性Number.NEGATIVE_INFINITY和Number.POSITIVE_INFINITY，其值分别为Infinity和 -Infinity。

复制代码代码如下:

 
console.info(0/0); //NaN 
console.info(NaN==NaN);//false 
console.info(NaN+1);//NaN 
console.info(NaN/NaN);//NaN 

var notNumber = NaN; 
console.info(notNumber==NaN);//false 
console.info(isNaN(notNumber));//true 
console.info(1/0); //Infinity 
console.info(-1/0); //-Infinity 
console.info(1/Infinity);//0 
console.info(Infinity/Infinity);//NaN 
console.info(Infinity==Infinity); //true 
var inf = Infinity; 
console.info(inf==Infinity);//true 
console.info(!isFinite(inf));//true 
console.info(!isFinite(NaN));//true 
console.info(isNaN(Infinity));//false 

注：在《JavaScript高级程序设计（第3版）》中第29页说任何数值除以0都会返回NaN，实际上并非如此。

5、String类型

　　和一般类C语言不同，在ECMAScript中，没有字符类型，而将字符串类型String作为一种简单类型，其字面量使用引号（单引号'或双引号“）括起来。

（1）对于字符串类型的操作，加号“+”被重载，任意一个数值与字符串相加，都会先将其使用String()转换成字符串，然后将两个字符串合并。

（2）使用String()转换，undefined—>'undefined'，null—>'null'，true—>'true'，false—>'false'，数值类型Number—>按数值可见的字符转换，对象Object—>调用toString。

复制代码代码如下:

 
console.info(''+1+1);//11，而不是2 
console.info(''+true);//true 
console.info(''+undefined);//undefined 
console.info(''+null);//null 

（3）字符串使用反斜杠“”来转义，常见的一些转义字符有：

字面量	含义	字面量	含义
\n	换行	\\	反斜杠
\t	制表	\'	单引号
\b	空格	\"	双引号
\r	回车	\xnn	以十六进制代码nn表示的一个字符
\f	进纸	\unnnn	以十六进制代码nnnn表示的一个Unicode字符