首页 > 代码库 > JavaScript中的类型转换(二)
JavaScript中的类型转换(二)
说明: 本篇主要讨论JavaScript中各运算符对运算数进行的类型转换的影响,本文中所提到的对象类型仅指JavaScript预定义的类型和程序员自己实现的对象,不包括宿主环境定义的特殊对象(比如浏览器定义的对象)
上一篇中讨论了JavaScript中原始类型到原始类型的转换,原始类型到对象类型的转换和对象类型到原始类型的转换,这里先提出一个问题
var a = undefined;if(a){ console.log(‘hello‘);}else{ console.log(‘world‘);}console.log(a == false);
以前我不对JavaScript的一知半解的时候,我以为上面的代码回先后输出‘world‘和‘true‘,但是经过执行代码,发现结果是‘world‘和‘false‘.undefined确确实实可以被转换为false,但是在使用==操作符对undefined和false两个值进行相等性比较时,由于两个操作数的类型不同,这里会发生类型转换,并且undefined并没有被转换为boolean类型然后跟false比较,所以本篇讨论下运算符对运算数类型转换的影响.
1.+(二元),==,!=,>,<,<=,>=
二元+运算符用于把两个数字相加或者连接两个字符串,所以该运算符期望的运算数类型为数字或者字符串。当运算数都是数字或者字符串时,结果是显而易见的，否则的话就会现对操作数进行类型转换，把操作数转换为数字或者字符串，然后进行数学相加或者连接字符串的运算。操作数会照下面的规则进行类型转换：
1.如果其中任一操作数是对象类型，先执行对象到原始类型的转换：对于Date对象，通过调用toString方法得到原始类型的值；对于其他对象，优先尝试valueOf方法,然后再尝试toString方法,如果valueOf和toString都无法得到原始类型的值,则会抛出异常
2.现在两个操作数都是原始类型了,如果其中一个操作数是字符串,则把另外一个原始类型的操作数转换成字符串,然后执行字符串连接运算
3.否则,把两个操作数都转换成数字进行数学加法运算
console.log(‘10‘+null);//10null console.log(‘10‘+undefined);//10undefined console.log(‘10‘+false);//10false console.log(‘10‘+true);//10true console.log(‘10‘+10);//1010 var o1 = {}; console.log(‘10‘+o1);//10[object Object] 对象默认的valueOf方法返回的不是原始类型,所以会调用toString方法 o1.toString = function(){ return ‘o1‘; } console.log(‘10‘+o1);//10o1 o1.valueOf = function(){ return null; } console.log(‘10‘+o1);//10null 对象现在有了一个返回原始类型的valueOf方法,不再调用toStringconsole.log(10+null); console.log(10+undefined);//NaN, undefinde转换成数字是Nan console.log(10+false);//10 console.log(10+true);//11 var o1 = {}; console.log(10+o1);//10[object Object] 对象默认的valueOf方法返回的不是原始类型,所以会调用toString方法,而toString返回的是字符串,所以执行字符串连接 o1.toString = function(){ return true; } console.log(10+o1);//11 o1.valueOf = function(){ return null; } console.log(10+o1);//10 对象现在有了一个返回原始类型的valueOf方法,不再调用toString var date = new Date; console.log(date + true);//Tue Aug 19 2014 10:32:49 GMT+0800 (中国标准时间)true
使用==运算符比较两个运算数的相等性时,如果两个运算数类型不一致,就会发生类型转换,转换时遵循以下规则
1.null和undefined是相等的
2.如果一个操作数是数字,另一个操作数是字符串,则把字符串转换成数字再进行比较
3.如果有布尔类型的操作数,把它转换成数字
4.如果其中一个操作数是对象类型,把对象类型转换成原始类型再进行比较.当把对象转换成原始值时,优先使用valueOf方法,其次使用toString方法,但是与+运算符一样,Date对象是个特例,Date对象调用toString方法
5.其余情况一律认为不想等
到这里可以解释本文开始提出的问题了,undefined与false进行==比较,false先被转换成数字0,然后与undefined比较,属于情况5,返回false
console.log(0 == null);//false console.log( 0 == undefined);// false console.log(0 == false);//true,false转换成0 console.log(1 == true);//true,true转换成1 console.log(true == ‘1‘);//true,true先转换成1,然后1转换成字符串‘1‘ console.log(null == ‘null‘);//false,情况5 var o = {}; console.log(o == ‘[object Object]‘);//true,toString方法返回‘[object Object]‘ o.valueOf = function(){ return ‘1‘; }; console.log(true == o);//true,true先转换为1,o先调用valueOf得到一个原始值‘1‘,数字与字符串比较,数字转换成字符串
对于!=运算符,结果总是与==运算符的结果相反
对于>,<(很萌有木有),<=,>=这四个比较运算符,期望的运算数类型与二元+一样,要么比较两个数字,要么比较两个字符串,如果运算数不全位数字或字符串,则会发生类型转换,转换的规则如下:
1.如果任一操作数是对象类型,则先后尝试valueOf方法和toString方法把对象转换成原始类型,需要注意的是这里Date不再做特殊处理了,与其他对象一样
2.经过第一步之后,两个操作数都是原始类型了,如果都是字符串,则进行字符串比较,如果都是数字,则进行数字比较
3.否则,把两个原始类型都转换成数字,然后进行比较
console.log(1 > null);//true,null->0 console.log( 1 >= undefined);// false,undefined->NaN console.log(1 <= undefined);//false console.log(null > undefined) // false,null->0,undefinde->NaN console.log(null <= undefined)//false console.log(‘1‘ < true);//false,‘1‘->1,true->1 console.log(‘1‘ > true);//false var o = {}; o.toString = function(){ return 10; }; console.log(o > 9);//true, o->10 console.log(o > ‘9‘)//true,o->10,‘9‘->9 o.toString = function(){ return ‘10‘; } console.log(o > 9);//true, o->‘10‘,‘10‘->10 console.log(o > ‘9‘)//false,o->‘10‘ o={}; var o1={}; console.log(o > o1);//o和o1都通过toString方法转换成了字符串,并且字符串内容是一致的 console.log(o < o1); console.log(o >= o1);
2.+(一元),-(一元和二元),*,++,--
这几个运算符期望的运算数都是数字类型,所以当操作数类型不对时,会把操作数转换为数字
var a = ‘10‘; console.log(+a);//+10 console.log(1 - a);//-9 console.log(a++);//10,但是此时a的类型已经发生了变化,++和--都需要一个左值,所以++‘10‘是错误的 console.log(typeof a);//输出number,a的类型已经改变 a = ‘10‘; var o = {}; o.toString = function() { return ‘10‘; } console.log(o++);//10,o->‘10‘->10 console.log(typeof o);//number o = {}; o.toString = function() { return ‘10‘; } o.valueOf = function(){ return false; } console.log(++o);//1,优先使用valueOf方法 console.log(typeof o);//number
3.总结
从本文的分析可以看出,JavaScript中的大部分运算符都只能对原始类型的操作数进行运算,其中一部分只能对数字类型进行运算,另一部分可以对数字和字符串类型进行运算,当进行运算时,运算数与预期的类型不相符合时,会通过先后调用valueOf和toString方法将对象类型转换为原始类型(需要注意Date对象的特殊性),然后再将原始类型转换为数字或者字符串.