[JavaScript] 运算符详解

文章目录

• [算术运算符（Arithmetic Operators）](#算术运算符（Arithmetic Operators）)
• • • 注意事项：
• [比较运算符（Comparison Operators）](#比较运算符（Comparison Operators）)
• • • 注意事项：
• [逻辑运算符（Logical Operators）](#逻辑运算符（Logical Operators）)
• • • 短路运算：
    • 逻辑运算符的返回值：
• [赋值运算符（Assignment Operators）](#赋值运算符（Assignment Operators）)
• [三元运算符（Ternary Operator）](#三元运算符（Ternary Operator）)
• [位运算符（Bitwise Operators）](#位运算符（Bitwise Operators）)
• 运算符优先级
• 小练习

算术运算符（Arithmetic Operators）

算术运算符用于完成基本的数学计算。

运算符	描述	示例	结果
+	加法	5 + 2	7
-	减法	5 - 2	3
*	乘法	5 * 2	10
/	除法	5 / 2	2.5
%	取余（模运算）	5 % 2	1
**	指数（幂运算）	2 ** 3	8
++	自增（每次加1）	let x = 5; x++	5，然后变为6
--	自减（每次减1）	let x = 5; x--	5，然后变为4

注意事项：

• 整数除法 ：JavaScript中没有整数除法，5 / 2 会得到浮点结果2.5。
• 自增/自减运算符 可以分为前置和后置：
  • 前置++x：先加1后返回结果。
  • 后置x++：先返回结果后加1。

let a = 10;
console.log(a++); // 输出 10，先返回后加1
console.log(a);   // 输出 11
console.log(++a); // 输出 12，先加1后返回

---

比较运算符（Comparison Operators）

比较运算符返回布尔值：true 或 false。

运算符	描述	示例	结果
==	相等（值相等）	5 == '5'	true
===	全等（值和类型都相等）	5 === '5'	false
!=	不相等（值不相等）	5 != '5'	false
!==	不全等（值或类型不相等）	5 !== '5'	true
>	大于	5 > 3	true
<	小于	5 < 3	false
>=	大于等于	5 >= 5	true
<=	小于等于	3 <= 5	true

注意事项：

• ==** 与 === 的区别**：
  • == 会进行类型转换，只比较值是否相等。
  • === 不会进行类型转换，要求值和类型都相等。

console.log(5 == '5');  // true，因为字符串'5'被转换成数字5
console.log(5 === '5'); // false，因为类型不同

---

逻辑运算符（Logical Operators）

逻辑运算符用于布尔值运算，主要包括：与 、或 、非。

运算符	描述	示例	结果
&&	逻辑与（AND）	true && false	false
`		`	逻辑或（OR）
!	逻辑非（NOT）	!true	false

短路运算：

• &&：遇到false会短路，直接返回false的值。
• ||：遇到true会短路，直接返回true的值。

let x = 5;
console.log(x > 0 && x < 10); // true，x大于0并且小于10
console.log(x > 0 || x < 3);  // true，x大于0或小于3
console.log(!(x > 0));        // false，x大于0的反向

逻辑运算符的返回值：

• && 和 || 不总是返回布尔值，它们会返回短路时的具体值。

console.log('a' && 'b'); // 'b'，因为'a'为真，继续返回后一个值
console.log(null || 'hello'); // 'hello'，因为`null`为假，返回`hello`

---

赋值运算符（Assignment Operators）

赋值运算符用来给变量赋值。

运算符	描述	示例	等价于
=	赋值	x = 5
+=	加后赋值	x += 3	x = x + 3
-=	减后赋值	x -= 3	x = x - 3
*=	乘后赋值	x *= 3	x = x * 3
/=	除后赋值	x /= 3	x = x / 3
%=	取余后赋值	x %= 3	x = x % 3
**=	幂后赋值	x **= 2	x = x ** 2

---

三元运算符（Ternary Operator）

三元运算符是一个简单的条件运算符，语法为：条件 ? 表达式1 : 表达式2。

let age = 20;
let isAdult = age >= 18 ? '成年人' : '未成年人';
console.log(isAdult);  // 输出：成年人

---

位运算符（Bitwise Operators）

位运算符操作二进制位，用得较少，但在某些性能优化或算法中很重要。

运算符	描述	示例
&	按位与	5 & 3（结果：1）
`	`	按位或
^	按位异或	5 ^ 3（结果：6）
~	按位取反	~5（结果：-6）
<<	左移	5 << 1（结果：10）
>>	右移	5 >> 1（结果：2）

---

运算符优先级

JavaScript中的运算符是有优先级的，高优先级的运算符会优先计算。

优先级	运算符	说明
1	()	括号
2	++ --	自增、自减
3	**	幂运算
4	* / %	乘、除、取余
5	+ -	加、减
6	< <= > >=	比较
7	== != === !==	相等、全等等
8	&&	逻辑与
9	`
10	=	赋值

---

小练习

可以尝试完成以下练习题：

1. 使用三元运算符，根据一个数字是否大于0来输出"正数"或"非正数"。
2. 判断一个字符串是否为空（长度为0），使用||输出默认值。