js神奇的“+”运算

众所周知,js是一门弱语言,不像Java一样,定义一个变量时得先申明这个变量的类型,通常我们在使用‘+’运算时,仅仅是对数字相加或者拼成字符串,但是也有一些意外,比如:
1.先来个简单的:

 true+true

打印出来是2,原因是js在执行的时候会把true转成数字1,false转成0;

2.再来个变态的:

[3,4]+[5,6]=?

如果知道原理的童鞋很快会告诉我答案是:3,45,6,为什么是这样呢?
原因很简单:首先要说下js的数据类型,基本类型是undefined、null、number、string、boolean,还有复杂数据类型Array、Object。在我们进行“+”运算时:
A:如果是数字相加则进行正常的加法运算;
B:如果有加数中有一个是非数字,那么就会转成string类型,进行字符串拼接;
C:如果是复杂类型的,Array会通过string()的方法,将数组转成对应的string,如果是空的Array则是‘’,如果是非空数组呢,例如[5,6]则转成‘5,6’;如果是对象,调用string方法后则返回‘[object Object]’;
所以[3,4]+[5,6]=‘3,4’+‘5,6’=3,45,6
3.升级版变态的:

{a:4}+[5,6]=?

根据上面的计算方法,我们很快可以得出是[object Object]5,6
{a:4}+[5,6]=’[object Object]’+‘5,6’=[object Object]5,6
4我们再看一组恶心的加法:

[]+{}=?
{}+[]=?

打印出来你会发现第一个为‘[object Object]’,符合我们的计算逻辑,但是第二个就变成‘0’(也有的浏览器是正常是为‘[object Object]’),至于为0的是什么原因呢?再执行的时候第一个{},浏览器会把它当做是一个statement(声明),真正执行的是+[],当+[]时,会把通过Number([])转成0
5.如果是2个空对象相加呢?

{}+{}=?

有的浏览器执行结果是‘[object Object][object Object]’,有的执行结果是NaN,如果是NaN的,那么执行过程与第5点相似了,相当于执行了+Number({}),所以结果是NaN。

总结:
1.number+number=加法运算 例如 2+3=5
2.number+String或者string+string=字符串拼接;1+‘a’='1a’
3.Array+Object=string(Array)+string(Object)
4.{}+any=Number(any)

猜你喜欢

转载自blog.csdn.net/weixin_43169949/article/details/95016829