当前位置: 代码迷 >> JavaScript >> JavaScript中“+”的圈套
  详细解决方案

JavaScript中“+”的圈套

热度:101   发布时间:2012-08-25 10:06:20.0
JavaScript中“+”的陷阱

以下运算

{}+{}

?

结果是什么?稍等..

?

先了解下+运算符。JavaScript中运算符 “+” 很简单,有两种意思

?

1,字符串连接

2,数字相加

?

运算时其它值都将转换成这两个类型。

?

?

JavaScript中有基本类型(undefined, null, booleans, numbers, strings)、对象类型(objects, arrays)和函数类型(functions)。

?

类型转换时先将对象/函数类型转换成基本类型。然后在根据运算符“+”转成字符串或数字。

?

其它基本类型转成数字 有如下规则

Number(undefined) // NaN
Number(null)      // 0
Number(true)      // 1
Number(false)     // 0
Number('1')       // 1
?

其它基本类型转成字符串 有如下规则

String(undefined) // "undefined"
String(null)      // "null"
String(true)      // "true"
String(false)     // "false"
String(1)         // "1"
?

?

回到上面的题目 : {}+{}

?

1,先将两个对象直接量转成基本类型,{}的valueOf()还是自己。如下

var obj = {};
obj.valueOf() === obj; // true
?

2,转成字符串,{}的toString()是“[object Object]”

?

最后两个字符串连接的结果是“[object Object][object Object]”。

?

?

结果真是这个吗?在浏览器的控制台中测试不是,是NaN。

?

?

真让人匪夷所思,前面一路推理下来最后竟然不对。

其实原因是第一个{}并非表示对象直接量,而是语句块的意思。参考:Javascript中大括号“{}”的多义性

?

即第一个大括号是语句块,该语句块中没有任何执行语句,可以忽略。演变是这样的

?

1 {}+{}

2 +{}

3 +"[object Object]"

4 NaN

?

?

恍然大悟了,加个小括号强制将第一个大括号转成对象直接量 。结果就是期望的了。如

({}+{})
?

这时将输出

?

?

补充:node环境中 {}+{} 输出的是“[object Object][object Object]” 却不是 NaN


相关:JavaScript中“+”的陷阱(续)

  相关解决方案