JS运算符介绍

JS运算符介绍

算数运算符、赋值运算符、一元运算符、关系运算符、逻辑运算符、位运算符、三目运算符以及运算符优先级

算术运算符

** 算数运算符包括 【+ - * / % 】**

1、“+” 如果+运算符有任意一端是字符串，代表字符串相加，首尾相连；另一端不管是什么类型都会隐式转换成字符串。隐式转换：自动默认转换，自动默认转换的方法是目标类型的构造函数强制转换。

console.log("abc"+"def");	//abcdef
console.log("abc"+5);		//abc5
console.log("cde"+true);	//cedtrue
console.log("abc"+null);	//abcnull
var a;
console.log("abc"+a);		//abcundefined
console.log("abc"+{a:1}); 	//abc[object Object]
console.log({a:1}+"");		//[object Object]
console.log(5+"");			//5	加空字符串等价于强制转换成字符串型

2、数值+布尔值会隐式转为数值相加
      数值+空值会隐式转为数值相加

console.log(1+true);		//2
console.log(1+false);		//1

console.log(1+undefined);	//NaN
console.log(1+null);		//1		null会隐式转换为0

3、数值与除了字符串外的非数值相加都会隐式转换为数值类型相加

4、布尔值、undefined、null相加也会转换为数值

 console.log(true+true);		//2
 console.log(true+null);		//1
 console.log(null+undefined);	//NaN

5、除了+以外，-，*，/，% 都会依照数值运算先将所有其他类型转换为数值后再运算

console.log(5-true);		//4
console.log(true*null);		//0
console.log(5+2-(true+"a"));//NaN

赋值运算符

算数运算符包括 【 = += *= /= %=】

1、先运算等号右侧的内容，将运算的结果赋值给等号左侧

var a=2;
a=a+2;
a+=2;

var b=a=2;	//先将a=2的结果返回赋值给b，再把2赋值给a

2、将运算结果赋值回原来的变量，覆盖原来值

3、可以转换数据类型

a+=""	//转换为字符串

a-=0	//转换为数值

4、特殊写法

var a=5,b=10,c=20;
a+=2,b+=2,c+=2;
console.log(a,b,c)

一元运算符（自增自减运算符）

一元运算符包括【++a,a++,–a,a–】

1、注意a++和a+=1的区别

var a="3";
a++;	//会隐式转换为数值在进行+1
a+=1;	//参照算数运算符进行运算

2、注意++a和a++的区别
      ++在前，先自加，再赋值；
      ++在后，先赋值，再自加。

var a=1;
var b=a++;	//b:2,a:1;
var b=++a;	//b:2,a:2;

3、小练习

var a=2;
console.log(++a + a + ++a + a + ++a + a,a);

console.log(++a+a---a+a---a+++a-(a+a++),a);

关系运算符

关系运算符包括 【< <= > >= == != === !==】
它会返回一个布尔值

1、== != 会自动隐式转换为两端类型相同后比较
      === !== 不转换类型，除了比较值以外还会比较类型

console.log(1=="1");		//true
console.log(1==true);		//true
 console.log(1===true);		//false

console.log(0==false);		//true
console.log(false=="");		//true
console.log(0=="");			//true
console.log(0==null);		//false
console.log(undefined==null);//true

注：

• 0 false “” " "相等；
• null undefined 相等 （空或者未赋值 ）
• NaN和NaN不等，不能用==NaN判断非数值

2、如何判断非数值类型？

console.log(isNaN(Number(a)))
console.log(Number.isNaN(Number(a)));

console.log(isNaN(a));
console.log(Number.isNaN(a));
console.log(Number.isNaN(Number(a)));

两种方式区别：

• 都是判断数值类型是不是非数值，Number.isNaN()是Number对象下的方式，不隐式转换；isNaN()是window下的方式，会先隐式转换为数值，然后在判断是否是非数值。

逻辑运算符

逻辑运算符包括 【&& || !】
1、&& || 返回的值根据内容确定类型，不是一定返回布尔值

var a=3;
console.log(a>2 && a<5);
console.log(a>5 || a<4);
a=a-3 || 1；
console.log(a);

2、如何判断返回的值是什么？（熔断）

找true熔断
true || true   返回前面的值  熔断
true || false  返回隐式转换布尔值为true的值 
false || true  返回隐式转换布尔值为true的值 
false || false  返回最后一个false的值
例
console.log(0 || false)			//false
var a=1;
a=--a || ++a;					//1（！！！）

找false熔断
true && true  第二个true的结果
true && false 返回false的结果
false && true 返回false的结果
false && false 返回第一个false的结果
例
var o;
o=0 || {a:1};				//{a:1}

3、!       返回值是布尔值
取反，取布尔值的反，如果是布尔值就会变成相反的结果，true–>false,false–>true
如果值不是布尔值就会隐式转换为布尔值，然后再取反 。

4、数组 拓展

console.log([]==[]);	//false
//因为数组是对象类型，也就是引用类型，两个新的数组是两个不同的引用对象，所以不相同
console.log([]==![]);	// true      
//""==false
console.log([1]==1)
console.log([]==0)
console.log([]==null)
1,2,3]--->"1,2,3"
[1]--->"1";
[]--->""

位运算符

1、位非运算符 ~

如果为整数，先加1，再取负值
如果有小数点，则先取整，再加一取负值
如果为字符串，则为-1

var a=6;
console.log(~a);	//-7

双位非 还原，取整 ,任何内容转换为数值，如果是非数值变为0，其他为数值

var a=1.23;
console.log(~~a);	//1

var b="abc";
console.log(~~a);	//0

例
var str="abcde";
if(!~str.indexOf("f")){		//字符串里没有这个字母则返回-1

}

3、位与运算符 &

console.log(30&45);
011110 //30
101101 //45
001100 //12

4、位或运算符 |

console.log(30|45);
011110 //30
101101 //45
111111 //63

5、位异或运算符

^异或
两个相同时为0，不同时为1
console.log(30^45);
011110
101101
110011

可以用来进行对称加密
var a=274675^123456
console.log(a);					//381619
console.log(381619^123456);

6、左移位运算符 <<

console.log(8<<2);		// 1000>100000	8>32

7、右移位运算符 >>

console.log(8>>2);		//1000>10	8>2

var a=1;
a<<=3;

三目运算符

条件？true:false

var a=5;
var b=a>3 ? 1 : 0;
// 如果a>3时，返回1赋值给b，否则返回0

var a=-1;
var b=a>1 ? 10 : a<0 ? 5 : 0;		//5

var a=5;
a+=a-5 ? 0 : 1;			//6

var a=1;
a-=0 ? 0 : 1;			//0

运算符优先级

优先级从上到下：

1. . [] () 字段访问、数组下标、函数调用以及表达式分组
2. ++ – - ~ ! delete new typeof void 一元运算符、返回数据类型、对象创建、未定义值
3. */ % 乘法、除法、取模
4. 加法、减法、字符串连接
5. << >> >>> 移位
6. < <= > >= instanceof 小于、小于等于、大于、大于等于、instanceof
7. == != === !== 等于、不等于、严格相等、非严格相等
8. & 按位与
9. ^ 按位异或
10. | 按位或
11. && 逻辑与
12. || 逻辑或
13. ?: 条件
14. = oP= 赋值、运算赋值
15. , 多重求值