JS基础：8个算数运算符详解

你好，我是云桃桃。

一个希望帮助更多朋友快速入门 WEB 前端的程序媛。

云桃桃 大专生，一枚程序媛，感谢关注。回复 “前端基础题”，可免费获得前端基础 100 题汇总，回复 “前端基础路线”，可获取完整web基础路线导图。

308篇原创内容-更多前端系列内容可以go公众.h：云桃桃

后台回复“前端基础路线”可获取前端基础学习路线

后台回复“前端基础题”可得到前端基础100题汇总，持续更新中

后台回复“前端电子书”可获取20+本精选电子书

前言

在 JavaScript 中，运算符主要分为以下几种类型：

1. 算术运算符：用于执行数学运算，如加法（+）、减法（-）、乘法（*）、除法（/）、取模（%），递增（++）和递减（--）等。

2. 赋值运算符：用于将一个值赋给一个变量，如等于（=）、加等于（+=）、减等于（-=）、乘等于（*=）、除等于（/=）、取模等于（%=）等。

3. 比较运算符：用于比较两个值的大小关系，如等于（==）、不等于（!=）、大于（>）、小于（<）、大于等于（>=）、小于等于（<=）等。

4. 逻辑运算符：用于执行逻辑运算，如与（&&）、或（||）、非（!）等。

5. 位运算符：用于对整数进行位运算，如按位与（&）、按位或（|）、按位异或（^）、左移（<<）、右移（>>）等。

6. 其他运算符：如条件运算符（?:）、逗号运算符（,）等。

这些运算符在 JavaScript 中具有不同的语法和功能，可以通过它们实现各种复杂的运算和逻辑判断。

我们今天先聊聊算数运算符，也就是数值运算，一共有 8 个，我们一起来看看吧。

加法（+）：

var num1 = 5
var num2 = 3

var sum = num1 + num2
// 输出结果：8
console.log(sum)

减法（-）：

var num5 = 10
var num6 = 5

var difference = num5 - num6
// 输出结果：5
console.log(difference)

乘法（*）：

var num9 = 4
var num10 = 2

var product = num9 * num10
// 输出结果：8
console.log(product)

除法（/）：

var num13 = 10
var num14 = 2

var quotient = num13 / num14
// 输出结果：5
console.log(quotient)

取模（%）：

它也叫取余，也就是除法的余数。

var num17 = 15
var num18 = 4

var remainder = num17 % num18
// 输出结果：3
console.log(remainder)

指数运算符（**）：

指数运算符（**）用于计算幂，即一个数的次方。这个运算符是在 ES6 中引入的，提供了一种更简洁的方式来进行指数运算，使用Math.pow()函数也来可以完成相同的任务。

比如，计算 2 的 3 次方。

var result = 2 ** 3 // 2 的 3 次方等于 8
console.log(result) // 输出: 8

再比如，计算 5 的 2 次方，然后与 2 相乘。

var value = 5 ** 2 * 2 // 5 的 2 次方等于 25，然后乘以 2 得到 50
console.log(value) // 输出: 50

使用指数运算符可以使得代码更加简洁和易于理解，特别是在进行幂运算时。它还支持小数指数，允许进行开方等操作。例如，Math.sqrt(value)可以简写为value ** (1/2)。

递加、递减

递增（++）和递减（--）运算符用于快速增加或减少变量的值。递增操作符有两种形式：前缀（++i）和后缀（i++），递减操作符同样也有前缀（--i）和后缀（i--）形式。

我们来一起看一下吧。

递增运算符（++）

前缀递增：在变量值增加之后，返回增加后的值。

var a = 2
var b = ++a // a 先增加 1，然后 b 得到 a 的值，即 b = 3
console.log(a) // 输出: 3
console.log(b) // 输出: 3

后缀递增：返回变量当前的值，然后变量值再增加。

var c = 5
var d = c++ // c 先提供其值给 d，然后 c 增加 1
console.log(c) // 输出: 6
console.log(d) // 输出: 5

递减运算符（--）

前缀递减：在变量值减少之后，返回减少后的值。

var e = 10
var f = --e // e 先减少 1，然后 f 得到 e 的值，即 f = 9
console.log(e) // 输出: 9
console.log(f) // 输出: 9

后缀递减：返回变量当前的值，然后变量值再减少。

var g = 15
var h = g-- // g 先提供其值给 h，然后 g 减少 1
console.log(g) // 输出: 14
console.log(h) // 输出: 15

我们在使用递增和递减运算符时，要注意它们是前缀还是后缀，因为这会影响运算符的返回值。前缀形式通常用于确保变量的值在表达式中立即更新，而后缀形式则用于在表达式求值之后进行更新。

算数运算符的优先级

那你可能会有这样的疑惑：如果一个语句涉及多个运算符，应该是什么样的顺序呢？

其实，算数运算符的优先级遵循数学中的运算法则，即先乘除后加减，同级运算符从左到右执行。以下是一些常用的算数运算符及其优先级顺序：

1. 有括号的时候，先计算括号内的。

2. 指数（**） - 表示幂运算。

3. 乘法（*）、除法（/）、取模（%） - 乘除取模运算优先于加减运算。

4. 加法（+）、减法（-） - 加减运算是运算的最低级。

举一些例子吧。

指数运算符（**）

var a = 2 ** 3 // a = 8
console.log(a) // 输出: 8

乘法和除法优先于加法和减法

var b = 10 * (3 + 2) // 先计算括号内的加法，再进行乘法
console.log(b) // 输出: 50

var c = 10 + 20 / 4 // 先进行除法，再进行加法
console.log(c) // 输出: 25

加法和减法

var d = 10 + 20 - 5 // 加法和减法从左到右计算
console.log(d) // 输出: 25

需要注意的是，

当表达式包含多个同级别的运算符时，它们会按照从左到右的顺序进行计算。

那，为了确保算数运算按照预期的顺序执行，建议使用括号明确指定优先级，尤其是当涉及到多个不同优先级的运算符时。

var e = (10 + 20) * 4 // 先计算括号内的加法，再进行乘法
console.log(e) // 输出: 120

var f = 10 - (3 + 2) / 4 // 先计算括号内的加法和除法，再进行减法
console.log(f) // 输出: 9

通过使用括号，你可以控制表达式的计算顺序，确保得到正确的结果。这是一种良好的编程实践，可以提高代码的可读性和准确性。

OK，本文完。