数学中的加减乘除运算符是我们最熟悉的,它们在 JavaScript 中起的作用是一样的,它能计算公式并返回结果。

2 + 3 // 加
5 - 2 // 减
2 * 4 // 乘,乘号是一个星号
4 / 2 // 除,除号是一个斜杠

除了加减乘除,JavaScript 中还有很多运算符值得我们去学习。

术语

运算元

运算元表示运算符作用的对象。如果一个运算符只有一个运算元,那么它被称为一元运算符,比如负号操作符 - 和类型检测运算符 typeof

$$edit$$
$$jsdemo$$
let x = -5
let result = -x // 取反

alert(result) // 5
alert(typeof result) // number,typeof 是类型检测运算符

如果一个运算符接收两个运算元,那么它被称为二元运算符,大部分运算符都是二元运算符。

数学运算符

有以下常见的数学运算符。

运算符 描述
+ 加法
- 减法
* 乘法
/ 除法
% 求余(有时候也叫取模)
** 求幂

加法

加法运算符可以用于数字类型的求和。

$$edit$$
$$jsdemo$$
let sum = 3 + 5
alert(sum)

在面对字符串类型时,加法运算符起的是拼接字符串的作用,并且只要任意一边运算元为字符串,另一边运算元也会自动转成字符串类型。

$$edit$$
$$jsdemo$$
let str = '三眼鸭'
alert(str + '的编程教室')
alert(str + 123456)

减法、乘法、除法就不再赘述了。

求余

求余指用一个数除以另一个数,不够除的部分就是余数,在 JavaScript 中 % 表示。

$$edit$$
$$jsdemo$$
alert(5 % 2) // 1
alert(8 % 5) // 3

求幂

b 的 n 次幂表示 n 个 b 相乘 ( b * b * ... * b),在数学上写作 b<sup>n</sup>,而在 JavaScript 中则用 b ** n 表示 。

image

$$edit$$
$$jsdemo$$
// 等同于 2 * 2 * 2
alert(2 ** 3) // 8
// 等同于 3 * 3
alert(3 ** 2) // 9

当然,幂运算的指数也可以是小数(分数),相当于 b 的 m 次方再开 n 次方根。

image

$$edit$$
$$jsdemo$$
alert(4 ** 0.5) // 2,等同于平方根
alert(8 ** (1 / 3)) // 2,等同于立方根

当然,指数还能是 0,除 0 外所有数的零次方都是 1。

image

$$edit$$
$$jsdemo$$
alert(3 ** 0) // 1
alert(4 ** 0) // 1

当然,指数还能是负数。

image

$$edit$$
$$jsdemo$$
alert(2 ** -2) // 0.25,等同于 1 / (2 ** 2)

$$tip

更多相关知识点请咨询你的数学老师,或参考幂 - wikipedia

$$

赋值运算符

赋值运算符用过很多次了,它会将右操作元的值分配给左操作元的变量。

$$edit$$
$$jsdemo$$
let x = 3
let y = x
alert(y)

左操作元必须是一个变量,不然会报错。

1 = 3 // Uncaught SyntaxError: Invalid left-hand side in assignment

链式赋值

在 JavaScript 中所有的运算符都会返回一个值,赋值运算符也不例外。

$$edit$$
$$jsdemo$$
let x
alert(x = 3)

运用这个特性,我们可以一次性给多个变量赋相同的值。

$$edit$$
$$jsdemo$$
let x, y, z
x = y = z = 123
alert(x) // 123
alert(y) // 123
alert(z) // 123

更多的赋值运算符

除了直接的赋值运算符还有以下的赋值运算符。

运算符 名称 作用
+= 加法赋值 左边的变量加上右边的数值并赋值
-= 减法赋值 左边的变量减去右边的数值并赋值
*= 乘法赋值 左边的变量乘以右边的数值并赋值
/= 除法赋值 左边的变量除以右边的数值并赋值
let x = 4
x += 2
alert(x) // 6
x -= 3
alert(x) // 3
x *= 4
alert(x) // 12
x /= 3
alert(x) // 4

自增和自减

自增自减运算符可以方便地对变量进行加 1 减 1 操作。

++ (自增运算符)将变量加 1:

$$edit$$
$$jsdemo$$
let counter = 2
// 等同于 counter = counter + 1
counter++
alert(counter) // 3

-- (自减运算符) 将变量减 1:

$$edit$$
$$jsdemo$$
let counter = 2
// 等同于 counter = counter - 1
counter--
alert(counter) // 1

++-- 可以置于变量前或变量后。

  • 当运算符置于变量后,被称为“后置形式”:counter++
  • 当运算符置于变量前,被称为“前置形式”:++counter

不管是放置在前后,它们在对 counter 的操作上结果是一样,但是返回的结果却有不同。

放置之后:

$$edit$$
$$jsdemo$$
let counter = 1
alert(counter++) // 1,返回 counter 运算之前的值

放置之前:

$$edit$$
$$jsdemo$$
let counter = 1
alert(++counter) // 2,返回 counter 运算之后的值

练习

  1. 今年第一天是周五,第九十天是周几? $$answer
$$jsdemo$$
$$edit$$
// 周五减1号
let offset = 4

let ninetyDay = 90 + offset

ninetyDay = ninetyDay % 7

alert(`第九十天是周 ${ninetyDay}`)

$$

  1. 以下代码的输出结果是什么?
let x = 2
let result = 2 * x++ + ++x

alert(result)

$$answer

$$jsdemo$$
$$edit$$
let x = 2
let result = 2 * x++ + ++x

alert(result)

$$

  1. 今年第一天是周五,第 n 天是周几,n 由用户输入。(会出现周 0 的情况,先把周 0 默认为周日不作处理)

$$tip 可以使用 Number(n) 将用户输入的字符串转成数字类型。 $$

$$demo <button onclick="calc()">日期计算</button>

<script> function calc() { // 周五减1号 let offset = 4

// 第 N 天
let nDay = prompt("请输入第几天")

// 先转成数字类型
nDay = Number(nDay)

nDay = nDay + offset

// 对每周七天求余
nDay = nDay % 7

alert(`那天是周 ${nDay}`)
}

</script>

$$

$$answer

$$jsdemo$$
$$edit$$
// 周五减1号
let offset = 4

// 第 N 天
let nDay = prompt("请输入第几天")

// 先转成数字类型
nDay = Number(nDay)

nDay = nDay + offset

// 对每周七天求余
nDay = nDay % 7

alert(`那天是周 ${nDay}`)

$$