一、运算符概述
1、定义
JavaScript中运算符主要用于连接简单表达式,组成一个复杂的表达式
2、运算符类别
- 算数运算符
- 赋值表达式
- 比较表达式
- 布尔运算符
- 位运算符
二、算数运算符
1、加法运算符(Addition):x + y
加法运算符是在运行时决定,到底是执行相加,还是执行连接。也就是说,运算子的不同,导致了不同的语法行为,这种现象称为“重载”(overload)
(1)、在两个操作数都是数字的时候,会做加法运算
console.log(2+4);//6
(2)、两个参数都是字符串或在有一个参数是字符串的情况下,会把另外一个参数转换为字符串做字符串拼接
console.log("2"+"4");//"24"
'3' + 4 + 5 // "345"
3 + 4 + '5' // "75"
(3)、在参数有对象的情况下
- 3.1首先自动调用对象的valueOf方法
一般来说,对象的valueOf方法总是返回对象自身,,也可自定义
- 3.2再自动调用对象的toString方法,将其转为字符串(如果valueOf方法直接返回一个原始类型的值,就不会调用tostring)
对象的toString方法默认返回[object Object],也可自定义
var obj = { p: 1 };
obj + 2 // "[object Object]2"
- 3.3自定义valueOf方法或toString方法,得到想要的结果
var obj = {
valueOf: function () {
return 1;
}
};
obj + 2 // 3
var obj = {
toString: function () {
return 'hello';
}
};
obj + 2 // "hello2"
- 3.4 Date对象特例
如果运算子是一个Date对象的实例,那么会优先执行toString方法。
var obj = new Date();
obj.valueOf = function () { return 1 };
obj.toString = function () { return 'hello' };
obj + 2 // "hello2"
(4)、在只有一个字符串参数和+号的时候会尝试将其转换为数字,转换失败输出NaN
console.log(+"4");//4
+'dddddd'
NaN
2、其他算术运算符
对于其他运算符,在运算前都强制转换数字,再运算。对象就调用valueOf或者toString,如果不能转换的,输出NaN
减法运算符(Subtraction): x - y
乘法运算符(Multiplication): x * y
除法运算符(Division):x / y
余数运算符(Remainder):x % y
自增运算符(Increment):++x(先加后赋值) 或者 x++(先赋值后加)
自减运算符(Decrement):--x 或者 x--
求负运算符(Negate):-x
数值运算符(Convert to number): +x
三、赋值运算符
赋值运算符用于给变量赋值,最常见的赋值运算符,当然就是等号,表达式x=y表示将y赋值给x。除此之外,JavaScript还提供其他11个赋值运算符。
运算时从右到左,如var z=y=x;
x += y // 等同于 x = x + y
x -= y // 等同于 x = x - y
x *= y // 等同于 x = x * y
x /= y // 等同于 x = x / y
x %= y // 等同于 x = x % y
x >>= y // 等同于 x = x >> y
x <<= y // 等同于 x = x << y
x >>>= y // 等同于 x = x >>> y
x &= y // 等同于 x = x & y
x |= y // 等同于 x = x | y
x ^= y // 等同于 x = x ^ y
四、比较运算符
比较运算符比较两个值,然后返回一个布尔值,表示是否满足比较条件。
JavaScript提供了8个比较运算符。
1、 == 比较两个值是否相等
- 相等运算符(==)会将它们转换成同一个类型,再用严格相等运算符进行比较。
2、=== 严格相等,比较它们是否为同一个值(数据类型也要相同)
内容较多,单独写了一篇文章去说相等和严格相等
3、!=不相等
4、!== 严格不相等
它的算法就是先求严格相等运算符的结果,然后返回相反值。
5、其他比较运算符(< 小于 <= 小于或等于 > 大于 >= 大于或等于)
5.1同为字符串按照Unicode 顺序进行比较
首先比较首字符的 Unicode 码点,如果相等,再比较第二个字符的 Unicode 码点,以此类推
5.2不全为字符串的比较,分成以下两种情况
1)原始类型值(数值、字符串、布尔值)
如果两个运算子都是原始类型的值,则是先转成数值再比较
5 > '4' // true
// 等同于 5 > Number('4')
// 即 5 > 4
true > false // true
// 等同于 Number(true) > Number(false)
// 即 1 > 0
2 > true // true
// 等同于 2 > Number(true)
// 即 2 > 1
2)有一方或者双方为对象的比较
调用valueOf方法和toString方法,转为原始类型的值,再进行比较
var x = [2];
x > '11' // true
// 等同于 [2].valueOf().toString() > '11'
// 即 '2' > '11'
{ x: 2 } >= { x: 1 } // true
// 等同于 { x: 2 }.valueOf().toString() >= { x: 1 }.valueOf().toString()
// 即 '[object Object]' >= '[object Object]'
五、布尔运算符
1、! 取反运算符
对数据取反,得到的都是布尔值!
2、&& 且运算符
1)用途:且运算符(&&)往往用于多个表达式的求值。
2) 运算规则是:如果第一个运算子的布尔值为true,则返回第二个运算子的值(注意是值,不是布尔值);如果第一个运算子的布尔值为false,则直接返回第一个运算子的值,且不再对第二个运算子求值。
var x = 1;
(1 - 1) && ( x += 1) // 0
x // 1
3)跳过第二个运算子的机制,被称为“短路”,有些程序员喜欢用它取代if结构
if (i) {
doSomething();
}
// 等价于
i && doSomething();
4)运算符可以多个连用
返回第一个布尔值为false的表达式的值。如果所有表达式的布尔值都为true,则返回最后一个表达式的值。
true && 'foo' && '' && 4 && 'foo' && true
// ''
1 && 2 && 3
// 3
3、|| 或运算符
1)运算规则:
如果第一个运算子的布尔值为true,则返回第一个运算子的值,且不再对第二个运算子求值;如果第一个运算子的布尔值为false,则返回第二个运算子的值
't' || 'f' // "t"
'' || 'f' // "f"
2)或运算符可以多个连用
这时返回第一个布尔值为true的表达式的值。如果所有表达式都为false,则返回最后一个表达式的值。
false || 0 || '' || 4 || 'foo' || true
// 4
false || 0 || ''
// ''
4、condition? true case : false case 三元条件运算符
1)简介:三元条件运算符由问号(?)和冒号(:)组成,分隔三个表达式。
2)规则:如果第一个表达式的布尔值为true,则返回第二个表达式的值,否则返回第三个表达式的值。
console.log(true ? 'T' : 'F');
六、位运算符
就是把两个做位运算的值,都按照二进制一位一位的按照符号规则进行运算
位运算符只对整数起作用,如果一个运算子不是整数,会自动转为整数后再执行
1、或运算(or):
符号为|,表示两个二进制位中有一个为1,则结果为1,否则为0。
0000 0010 | 0000 0001 就等0000 0011(3)
2、与运算(and):
符号为&,表示两个二进制位都为1,则结果为1,否则为0。
0000 0010 & 0000 0001 就等0000 0000(0)
3、否运算(not):
符号为~,表示将一个二进制位变成相反值。
~ 0000 0010 就等于1111 1101
4、异或运算(xor):
符号为ˆ,表示两个二进制位中有且仅有一个为1时,结果为1,否则为0。
5、左移运算(left shift):符号为<<
1(数值)<<1(左移的位数) //2
1<<2 //4
1<<3 //8
6、右移运算(right shift):符号为>>
8>>1 //4
7、带符号位的右移运算(zero filled right shift):符号为>>>
七、其他运算符
1、()小括号
圆括号是一种运算符,它有两种用法:
1)如果把表达式放在圆括号之中,作用是求值
2)如果跟在函数的后面,作用是调用函数。
2、逗号运算符
逗号运算符用于对两个表达式求值,并返回后一个表达式的值。
var x = 0;
var y = (x++, 10);
x // 1
y // 10
八、运算符的优先级
运算符的优先级,建议还是查看mdn。全部记住很难,简单理一下顺序,加深直觉(不准确哟)
自增 > 逻辑非>typeof > 加减乘除 > 判断大小(><=) >逻辑运算(与或)>三元条件运算符 >赋值 >,)
1、typeof的优先级相当的高,比加减乘除神马的都高,所以虽然是操作符,在在复杂表达式的时候我们还是习惯加括号,看个例子
typeof 2*3;//NaN
typeof (2*3);//"number"
typeof 2+3;// "number3"
2、 ++、--是右结合的操作符(优先级最高的几个都是右结合),而且比加减乘除优先级高。同时自增、自减运算符的运算数得是左值(可以放在赋值符号左边的值),而不能是常数
var a=0,b=0;
a+++b;//0
a;//1,a++优先级比++b高,所以相当于(a++)+b
b;//0
3、赋值运算符的优先级相当的低
a = b == c; //等同于a = (b==c)
4、逻辑非!也在优先级队列的前端,比加减乘除高,但逻辑与、逻辑或优先级很低,不如加减乘除
!2*0; //0, 等价于(!2)*0