24 运算符

运算符(operator)也被称为操作符,是用于实现赋值、比较和执行算数运算等功能的符号。

  • 算数运算符
  • 递增和递减运算符
  • 比较运算符
  • 逻辑运算符
  • 赋值运算符

24.1 数学运算符

数字型数据可以有很多操作,比如,乘法 * 、除法 / 、加法 + 、减法 - 等等,所以经常和数学运算符一起。 数学运算符也叫算术运算符,主要包括加、减、乘、除、取余(求模)。

  • +:求和
  • -:求差
  • *:求积
  • /:求商
  • %:取模(取余数)

同时使用多个运算符编写程序时,会按着某种顺序先后执行,我们称为优先级。 JavaScript中 优先级越高越先被执行,优先级相同时以书从左向右执行。

  • 乘、除、取余优先级相同
  • 加、减优先级相同
  • 乘、除、取余优先级大于加、减
  • 使用 () 可以提升优先级
  • 总结: 先乘除后加减,有括号先算括号里面的~~~

详见:示例

案例:计算圆的面积

需求:对话框中输入圆的半径,算出圆的面积并显示到页面

详见:示例

案例

用户订单信息案例 需求:用户输入商品价格和商品数量,以及收货地址,可以自动打印订单信息

24.2 赋值运算符

用来把数据赋值给变量的运算符

  • =
  • +=+=
  • *=/=%=
var age = 10;
age += 5; // 相当于 age = age + 5;
age -= 5; // 相当于 age = age - 5;
age *= 10; // 相当于 age = age * 10;

详见:示例

24.3 自增自减运算符

如果需要反复给数字变量添加或减去1,可以使用递增(++)和递减( – )运算符来完成。

在 JavaScript 中,递增(++)和递减( – )既可以放在变量前面,也可以放在变量后面。放在变量前面时,我 们可以称为前置递增(递减)运算符,放在变量后面时,我们可以称为后置递增(递减)运算符。

24.3.1 前置递增运算符

++num 前置递增,就是自加1,类似于 num = num + 1,但是 ++num 写起来更简单。 使用口诀:先自加,后返回值

var num = 10;
alert(++num + 10); // 21

24.3.2 后置递增运算符

num++ 后置递增,就是自加1,类似于 num = num + 1 ,但是 num++ 写起来更简单。 使用口诀:先返回原值,后自加

var num = 10;
alert(10 + num++); // 20

详见:示例

24.4 比较运算符

概念:比较运算符(关系运算符)是两个数据进行比较时所使用的运算符,比较运算后,会返回一个布尔值 (true / false)作为比较运算的结果。

24.4.1 数字型的比较

表2.1: 比较运算符
运算符名称 说明 案例 结果
< 小于 1<2 true
> 大于 1>2 false
>= 大于等于 2>=2 true
<= 小于等于 3<=2 false
== 值等于,仅要求值相等 37==37 ture
!= 不等于 37!=37 false
=== 全等,要求值和数据类型均相等 37===‘37’ false
console.log(18 == '18');
console.log(18 === '18');

注:比较运算符会隐式转换字符型为数字型:

//比较运算符会隐式转换
console.log(2 == '2'); //true

详见:示例

24.4.2 字符串的比较

字符串比较,是比较ASCII字符码。

  • 从左往右依次比较
  • 如果第一位一样,再比较第二位,以此类推
ACSII字符代码表

图24.1: ACSII字符代码表

详见:示例

24.5 逻辑运算符

逻辑运算符是用来进行布尔值运算的运算符,其返回值也是布尔值。后面开发中经常用于多个条件的 判断。

主要用于解决多重条件判断。如,判断一个变量是否大于5且小于10。

表17.1: 逻辑运算符
符号 名称 特点
&& 与、并且 符号两边都为true,结果才为true
|| 或、或者 符号两边有一个为true,结果就为true
! 非、取反 true变false,false变true

案例:判断一个数是4的倍数,且不是100的倍数

详见:示例

24.6 运算符优先级

表4.2: 运算符的优先顺序
优先级 说明 顺序
1 小括号 ()
2 一元运算符 ++ – !
3 算数运算符 先 * / %,后+ -
4 关系运算符 > >= < <=
5 相等运算符 == != === !==
6 逻辑运算符 先&& 后||
7 赋值运算符 =
8 逗号运算符 ,
let a = 3 > 5 && 2 < 7 && 3 == 4 //false
console.log(a);

let b = 3 <= 4 || 3 > 1 || 3 != 2 //true
console.log(b);

let c = 2 === '2' //false
console.log(c);

let d = !c || b && a //true
console.log(d);