赋值运算符
算术运算符
一元运算符
三元/三目运算符
比较运算符
逻辑运算符
运算符优先级
在JavaScript中,常见的运算符可以包括赋值运算符、一元运算符、算术运算符(二元运算符)、三元/三目运算符、比较运算符、逻辑运算符等(其他不常见的这里不说明)。
赋值运算符
赋值运算符用于给变量赋值,如=
、+=
、-=
、*=
、/=
、%=
、**=
、&=
、|=
、^=
、<<=
、>>=
、>>>=
。
常见的符号是“=”,表示赋值,假设现在有一个user变量,user="admin",表示将字符串"admin"赋值给user变量。如下:
+=、-=、*=、/=、%=都是用于变量自身与其他变量(常量)做数学运算,例如,a+=1,相当于a=a+1,也就是将a+1的结果赋值给a,其他符号同理。
a-=1 ,相当于a=a-1,也就是将a-1的结果赋值给a。
a/=2 ,相当于a=a/2,也就是将a/2的结果赋值给a。
a*=2 ,相当于a=a*2,也就是将a*2的结果赋值给a。
a%=3 ,相当于a=a%3,也就是将a%3的结果赋值给a。
完整代码如下:
<script>
// 1)赋值运算符
var user = "admin";
console.log(user);//'admin'
var a = 10;
console.log(a);
a += 1;
console.log(a);
var a = 10;
console.log(a);
a -= 1;
console.log(a);
var a = 10;
console.log(a);
a /= 2;
console.log(a);
var a = 10;
console.log(a);
a *= 2;
console.log(a);
var a = 10;
console.log(a);
a %= 3;
console.log(a);
</script>
算术运算符
算术运算符又称为二元运算符,也就是需要两个操作数,算术运算符用于执行基本的数学运算,如+
(加)、-
(减)、*
(乘)、/
(除)、%
(取余)、**
(幂运算符)、++(自增运算符)、--(自减运算符)
其中,+
(加)、-
(减)、*
(乘)、/
(除)、%
(取余)、**
(幂运算符)与数学计算完全相同,代码如下:
完整代码如下:
<script>
// 2)算术运算符
console.log(1 + 2);
console.log(1 - 1);
console.log(1 * 1);
console.log(1 / 1);
console.log(12 % 10);
console.log(2 ** 2);
</script>
一元运算符
自增自减运算符(++、--)包括前置自增自减(++n、--n)运算符和后置自增自减(n++、n--)运算符,两者在计算上有区别。
前置自增自减(++n、--n)运算符是先计算后输出,后置自增自减(n++、n--)运算符是先输出后计算。
假设定义一个变量a,值为10,定义一个变量b,值为20,分别利用前置自增和后置自增来观察两者的区别,可以发现前置自增计算的a输出后为11,后置自增计算的b输出的值为20,再次输出才为21。
代码如下:
<script>
var a = 10;
console.log(a);
console.log(++a);
console.log(a);
var b = 20;
console.log(b);
console.log(b++);
console.log(b);
</script>
三元/三目运算符
三元运算符也叫做条件运算符,需要三个操作数,形式如条件是否成立?执行代码1:执行代码2,返回的是一个值。
条件是否成立?成立执行代码:不成立执行代码
var d = b > c ? b : c; 表示将获得的值赋给d,条件是b是否大于c,如果大于(成立),返回b的值,如果小于(不成立),返回c的值。
完整代码如下:
<script>
// 条件判断的表达式
// 三元运算
// 条件是否成立?执行代码1:执行代码2
var b = 10;
var c = 20;
var d = b > c ? b : c;
console.log(d);
// 定义变量记录小时
var h = 6;
var v = h < 10 ? '0' + h : h;
console.log(v);
1 > 2 ? console.log("条件成立") : console.log("条件不成立");
false ? console.log("条件成立") : console.log("条件不成立");
true ? console.log("条件成立") : console.log("条件不成立");
</script>
比较运算符
比较运算符用于比较两个值,如==
、===
、!=
、!==
、>
、>=
、<
、<=
,两个数比较后输出的是布尔值(true/false)
其中,>
、>=
、<
、<=
运算符与数学中的运算符完全一致,比较后输出布尔值。
代码如下:
<script>
// 3) 比较运算符
console.log(1 > 2);
console.log(1 < 2);
console.log(1 >= 2);
console.log(1 <= 2);
</script>
“==”、“===”符号用于比较两个数是否相等,返回值也是布尔值,其中“==”仅比较两个数的值,如果数据类型不相等,只要值相等就是true,“===”比较两个数的值以及数据类型,只有数据类型和值都相同才为true。
完整代码:
<script>
console.log(1 == '1');
console.log(1 == 2);
console.log(1 === '1');
console.log(1 === 1);
</script>
“!=”、“!==”符号与 “==”、“===”相反,用于比较两个数是否不相等,返回值也是布尔值,其中“!=”仅比较两个数的值,如果数据类型不相等,只要值不相等就是true,“!==”比较两个数的值以及数据类型,只有数据类型和值都不相等才为true。
完整代码:
<script>
console.log(1 != '1');
console.log(1 != 1);
console.log(1 != 2);
console.log(1 !== '1');
console.log(1 !== 1);
</script>
逻辑运算符
逻辑运算符用于逻辑运算,如&&
(逻辑与)、||
(逻辑或)、!
(逻辑非)。
符号 | 名称 | 日常读法 | 特点 | 口诀 |
&& | 逻辑与 | 并且 | 符号两边都为真(true),结果才为真(true) | 一假则假 |
|| | 逻辑或 | 或者 | 符号一个为真(true),结果就为真(true) | 一真则真 |
! | 逻辑非 | 取反 | 真(true)变假(false),假(false)变真(true) | 真变假,假变真 |
&&
(逻辑与)表示条件两个或者以上,只要有一个条件不成立(是假),结果就不成立(是假)
在&&
(逻辑与)中,如果有一个为真,另一个有值,就把值赋给这个变量。
完整代码如下:
<script>
console.log(true && false);// false
console.log(true && false && true && true);// false
console.log(true && true && true && true);// true
console.log(1 < 2 && 3 < 4 && 4 < 5 && 5 < 6);// true
var k1 = true && false;
console.log(k1);// false
var k2 = false && true;
console.log(k2);// false
var k3 = true && true;
console.log(k3);// true
var k4 = true && 100;// 前者有值为true, 选择把后者的值赋给变量
console.log(k4);// 100
</script>
||
(逻辑或)表示条件两个或者以上,只要有一个条件成立(真的),结果就成立(是真),只有条件都为不成立(假),才是不成立(假)。
在 ||
(逻辑或)中,如果有一个为空(空字符串、未定义等),另一个有值,就把值赋给这个变量。
完整代码如下:
<script>
console.log(true || false);// true
console.log(true || false || false || false);// true
console.log(false || false || false || false);// false
console.log(1 < 2 || 2 > 3 || 3 > 4 || 4 > 5);// true
var v1 = true || false;
console.log(v1);// true
var v2 = false || true;
console.log(v2);// true
var v3 = "" || "hello world";// 前者没有值,就把后者的值赋给变量
console.log(v3);// 'hello world'
var v4 = undefined || 123;
console.log(v4);// 123
</script>
! (取反运算符)表示取相反的逻辑值,也就是说,如果是表达式是真,!(表达式)就是假,如果表达式是假,!(表达式)就是真。
完整代码如下:
<script>
console.log(true);// true
console.log(!true);// false
console.log(!false);// true
// (100 可以表示有值,有值表示true, 在true前面加叹号表示取相反的值)
console.log(!100);// false
</script>
运算符优先级
在含多个运算符时,按照优先级进行计算,优先级越小,越先计算。
优先级 | 运算符 | 顺序 |
1 | 小括号 | () |
2 | 一元运算符 | ++、--、! |
3 | 算术运算符 | 先*/ 后 +- |
4 | 关系运算符 | >、>=、<、<= |
5 | 相等运算符 | ==、===、!=、!== |
6 | 逻辑运算符 | 先&&后|| |
7 | 赋值运算符 | = |
8 | 逗号运算符 | , |