共计 3421 个字符,预计需要花费 9 分钟才能阅读完成。
这一节,我们来介绍 JavaScript 的运算符。运算符是完成一系列操作的符号,例如两个数字型数据相加用“+”,相乘用“*”等。
JavaScript 的运算符按运算符类型可以分为以下 5 种:
- (1)算术运算符;
- (2)比较运算符;
- (3)赋值运算符;
- (4)逻辑运算符;
- (5)条件运算符;
接下来,我们一一对其进行介绍。
一、算术运算符
算术运算符用于在程序中进行加、减、乘、除等运算。
JavaScript 中常用的算术运算符如下:
运算符 | 描述 | 示例 |
---|---|---|
+ | 加 | 4+6 // 返回值 10 |
- | 减 | 7-2 // 返回值 5 |
* | 乘 | 2*3 // 返回值 6 |
/ | 除 | 12/3 // 返回值 4 |
% | 求余 | 7%4 // 返回值 3 |
++ | 自增 | 见下面 |
-- | 自减 | 见下面 |
初学者注意一下,在 JavaScript 中,除号不是“÷”,而是“/”,别傻乎乎地用错了。
1、自增运算符
“++”是自增运算符,它指的是在原来值的基础上加 1,i++ 表示“i=i+1”。该运算符有 2 种情况:
(1)i++
“i++”指的是在使用 i 之后,使 i 的值加 1。
举例:
i=1;
j=i++;
上面执行的结果:j 的值为 1,i 的值为 2。
其实上面代码等价于下面这一段代码:
i=1;
j=i;
i++;
(2)++i
“++i”指的是在使用 i 之前,先使 i 的值加 1。
举例:
i=1;
j=++i;
上面的执行结果:j 的值为 2,i 的值为 2。
其实上面代码等价于下面这一段代码:
i=1;
i++;
j=i;
2、自减运算符
“--”是自减运算符,它指的是在原来值的基础上减 1,i-- 表示“i=i-1”。该运算符同样有 2 种情况:
(1)i--
(2)--i
举例:
i=6;j=i--;// j 的值为 6,i 的值为 5
i=6;j=--i;// j 的值为 5,i 的值为 5
举例:JavaScript 算术运算符
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var n1=6,n2=7;
var m1=n1+n2;
var m2=n1*n2;
var m3=n1++;
var m4=--n2;
document.write("m1="+m1+"<br/>");
document.write("m2="+m2+"<br/>");
document.write("m3="+m3+"<br/>");
document.write("m4="+m4+"<br/>");
</script>
</head>
<body>
</body>
</html>
在浏览器预览效果如下:
二、比较运算符
比较运算符的基本操作过程是:首先对操作数进行比较,该操作数可以是数字也可以是字符串,然后返回一个布尔值 true 或 false。
运算符 | 描述 | 示例 |
---|---|---|
< | 小于 | 1<4 // 返回 true |
> | 大于 | 2>5 // 返回 false |
<= | 小于等于 | 8<=8 // 返回 true |
>= | 大于等于 | 3>=5 // 返回 false |
== | 是否等于 | 5==6 // 返回 false |
!= | 是否不等于 | 5!=6 // 返回 true |
在此说明一点,如果比较 m 和 n 两个变量是否相等,“m=n”这是错误的,因为“=”表示赋值运算符(我们接下来会讲到),应该写成“m==n”。
举例:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var age=12;
document.write("age>20:"+(age>20)+"<br/>");
document.write("age<20:"+(age<20)+"<br/>");
document.write("age!=20:"+(age!=20)+"<br/>");
document.write("age<=20:"+(age<=20)+"<br/>");
</script>
</head>
<body>
</body>
</html>
在浏览器预览效果如下:
分析:“<br/>”表示换行,当然也可以使用转义字符“\n”来实现,只不过前一个是使用 HTML 标签实现,后面一个使用转义字符实现。
三、赋值运算符
JavaScript 中的赋值运算可以分为 2 种:简单赋值运算和复合赋值运算。
简单赋值运算是将赋值运算符(=)右边表达式的值保存到左边的变量中。
复合赋值运算结合了其他操作(如算术运算操作)和赋值操作。
举例:
sum=sum+i;// 简单赋值运算;
sum+=i;// 复合赋值运算,等价于 sum=sum+i;
运算符 | 示例 |
---|---|
= | author="helicopter" |
+= | a+= b 等价于 a =a+b |
-= | a-= b 等价于 a =a-b |
*= | a*= b 等价于 a =a*b |
/= | a/= b 等价于 a =a/b |
%= | a%= b 等价于 a =a%b |
&= | a&= b 等价于 a =a&b(& 是逻辑与运算) |
|= | a|= b 等价于 a =a|b(| 是逻辑或运算) |
^= | a^= b 等价于 a =a^b(^ 是逻辑异或运算) |
对于最后 3 个,平常不经常用,忽略掉算了。
四、逻辑运算符
逻辑运算符通常用于执行布尔运算,它们常常和比较运算符一起使用来表示复杂比较运算,这些运算涉及的变量通常不止一个,而且常用于 if、while 和 for 语句中。
运算符 | 描述 | 示例 |
---|---|---|
&& | 逻辑与,若两边表达式的值都为 true,则返回 true;任意一个值为 false,则返回 false | (8>5)&&(4<6),返回 true;(8<5)&&(4<6),返回 false |
|| | 逻辑或,只有表达式的值都为 false,才返回 false,其他情况返回 true | (8<5)||(4<6),返回 true;(8<5)&&(4>6),返回 false |
! | 逻辑非,若表达式的值为 true,则返回 false;若表达式的值为 false,则返回 true | !(9>2),返回 false;!(9<2),返回 true |
举例:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
document.write((8 > 5) && (4 < 6)+"<br>");
document.write((8 < 5) || (4 < 6)+"<br>");
document.write(!(9 > 2));
</script>
</head>
<body>
</body>
</html>
在浏览器预览效果如下:
总结:
(1)true 的! 为 false,false 的! 为 true;
(2)a&&b,a、b 全为 true 时,表达式为 true,否则表达式为 false;
(3)a||b:a、b 全为 false 时,表达式为 false,否则表达式为 true;
大家好好琢磨和理解一下,这是比较基础的东西喔。
五、条件运算符
条件运算符是 JavaScript 支持的一种特殊的运算符。
语法:
条件 ? 表达式 1 : 表达式 2;
说明:如果“条件”为 true,则表达式的值使用“表达式 1”的值;如果“条件”为 false,则表达式的值使用“表达式 2”的值。
例如:
(x>y)?4*3:5
分析:如果 x 的值大于 y 的值,则上面整个表达式最终的值为“12(由 4 * 3 得到)”;如果 x 的值小于或等于 y 的值,则上面整个表达式最终的值为“5”。
举例:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
var a=3;
var b=5
var c=(a<b)? "正确":"错误";
document.write(c);
</script>
</head>
<body>
</body>
</html>
在浏览器预览效果如下:
这一节还是比较简单的,大家好好看看就懂了。
疑难解答:
1、比较运算符“= =”与赋值运算符“=”的不同之处在于什么地方?
在各种运算符中,比较运算符“= =”与赋值运算符“=”是完全不同的。比较运算符“= =”用于比较两个操作数的值是否相等,并且返回 true 或 false;而赋值运算符“=”用于给操作数赋值。
如果在需要比较两个表达式的值是否相等的情况下,错误的使用赋值运算符“=”,则会将右操作数的值赋给左操作数。
对于比较运算符“= =”与赋值运算符“=”,初学者很容易用混,大家得仔细区分一下。