日期:2014-05-16  浏览次数:20318 次

javascript数据类型转换 []+{} 和 {}+[]

吐下槽,javascript数据类型真的很奇葩

看了一个页面《出几道JS的题》,当时确实挺感兴趣地就点进去了。但是看了那几道题,确实才感觉自己对javascript这个语言认识的缺乏。

{} + [] = ?

[] + 0 = ?

{} + 0 = ?

({} + []) = ?

之前看了《javascript高级程序设计》介绍数据类型的时候,知道在操作符的时候javascript的数据类型会出现转换在二元操作符"+"加法时,它会遵循一些规则:

1 两个操作符都是数值,就执行常规的加法运算
2 两个中有一个操作数是字符串
(1)两个操作数都是字符串,就把两个拼接起来
(2)其中有一个是字符串,那么就讲另外一个操作数转换成字符串,然后再拼接
3 有一个操作数是对象、数值或布尔值,就调用它们的toString()转换成字符串,而对于undefined和null就调用String()函数
但是上面执行的结果是什么呢?当时我马上就打开了chrome的控制台,把上面的几句代码敲进去了,看了看,出乎我的预料。
  • {} + [] =0
  • [] + 0 = "0"
  • {} + 0 = 0
  • ({} + []) =[object Object]

出现上面结果的原因

对于javascript解析器,我们要了解下
第一个就是{}符号的使用,如果是通过var 来定义一个变量并把{}赋值给那个变量的话,那么它就是相当于new Object()。但是如果直接在js文件中使用{},javascript解析器会把它当成语句块(虽然js是没有块级作用域的)来使用,它已经不是对象的意思了。
第二个是一元操作符“+”的使用,它对数据类型的转换是相当于调用Number()构造函数的,它也有一系列的规则
  • Boolean类型,true和false会分别被转换成1,0
  • null转换成0,undefined转换成NaN
  • 字符串类型,转换比较复杂。

    (1) 如果都是数字,就将其转换成十进制,并会忽略掉前导的零

    (2) 如果包含有效的小数点的话,它会转换成浮点类型

    (3) 如果包含有效的16进制的话, 会转换成10进制

    (4) 如果是空字符串的话,就转换成0

    (5) 其余的转换成NaN

  • 如果是对象的话

    (1) 先调用对象自身的valueOf方法,如果该方法返回原始类型的值(数值、字符串和布尔值),则直接对该值使用Number方法,不再进行后续步骤;

    (2) 如果valueOf方法返回复合类型的值,再调用对象自身的toString方法,如果toStr