精彩的javascript对象和数组混合相加

最近遇到一个让人困解的一个问题;一个简单的js加法运算表达式:

1 +[]; //这里加上一个空数组得到什么???
答案:'1';

为什么答案是1,一开始我也很困惑;后来我读了一篇文章才知道:在javascript中加法的规则很简单,只能数字与数字相加或字符串和字符串相加;所有其他类型的值都会自动转换成这两个类型的值。这里面其实有一个隐式转换的存在。这里就不得不说javascript的两种类型的值了;即原始值和对象值(或者说引用类型的值),原始值有undefined,null,boolean,number,String;而其他的值都是对象值包括数组(Array)和函数(function);判断一个值是否是原始类型的值的话可以使用typeof,判断是否是对象值的话可以使用instanceOf;这里要注意的是typeof null;//'object'得到的是object;这里w3School上的解释是javascript最初实现的一个错误,然后被ECMAScript沿用了。现在null被认为是对象的占位符,从而解释了这一矛盾。但从技术上来说null仍是原始值。

类型转换

javascript中加法会触发3种类型转换;即将值转换为原始值,转换为字符串,转换为数字。这刚好对应了javascript引擎内部的转换操作:ToPrimitive(),toString(),toNumber;

所以这里:1 + [] = '1';即[].toString() = ''; 然后1 + '' = '1';即把1转换成字符串,'1' + '' = '1' 最后就是两个字符串连接成的字符串;(详细可见w3School中的javascript加法运算http://www.w3school.com.cn/js/pro_js_operators_additive.asp)

明白了这个接下来的加法运算也就一目了然了:

+[] = 0; //其实就是Number([]),当Number作为一个函数调用(而不是作为构造函数调用时)会在引擎内部执行toNumber操作
+{} = NaN; // Number('[object,object]'); -->NaN 即String({})='[object,object]'; +'[object, object]' = NaN
1 + [1] = '11'; // String({}) = '1' --> '1' + '1' = '11'
1 + [1, 2] = '11,2'; // String([1,2]) = '1,2' ---> '1' + '1,2' = '11,2';
1+ {} = '1[object,object]'; String({}) = '[object, object]' ---> '1' + '[object, object]' = '1[object,object]';
[]+[] = ''; // 其实就是String([]) = '';---> '' + '' = '';
[]+{} = '[object,object]'; //同上String([]) = '', String({}) = '[object,object]' ---> '' + '[object, object]' = '[object, object]';
{} + {} = NaN;//这里值得注意的是javascript会把第一个{}解释成一个空块并忽略了它所以这里等价于+{}


参考:http://www.2ality.com/2011/03/javascript-values-not-everything-is.html

原文地址:https://www.cnblogs.com/leungUwah/p/5452731.html