JavaScript中6种核心运算符详解

方予
方予
发布时间:2026-10-15| 6人浏览过
原创

JavaScript运算符是构建程序逻辑的基础,涵盖数值计算、变量赋值、条件判断及数据拼接等场景。本文将深入解析算术、赋值、比较、三元、逻辑及字符串连接六种运算符的运作机制与典型用法。

算术运算符

算术运算符用于执行常见的数学计算,支持整数和浮点数处理。下表总结了主要算术符号及其行为:

运算符 说明 例子 运算结果
+ 加法 y = 2 + 1 y = 3
- 减法 y = 2 - 1 y = 1
* 乘法 y = 2 * 3 y = 6
/ 除法(返回浮点类型) y = 6 / 3 y = 2
% 取余数 y = 6 % 4 y = 2
++ 递加运算 y = 2; ++y y = 3
-- 递减运算 y = 2; --y y = 1

递增与递减的区别

++和--分为前缀和后缀形式,两者的区别在于返回值的时间点不同:

  • 前缀模式:+ +y 先增加变量的值,再使用其新值参与表达式运算。
  • 后缀模式:y+ + 先使用变量原有的值参与运算,然后再增加变量的值。
var x = 2;
console.log(++x); // 输出:3 (先自增,再输出)
console.log(x);   // 输出:3

var y = 2;
console.log(y++); // 输出:2 (先输出原值,再自增)
console.log(y);   // 输出:3

注意:此运算对布尔值和 null 无效。

赋值运算符

赋值运算符用于将右操作数的值赋给左操作数变量。除了基础的 = 外,还支持结合算术运算的简写形式,以提高代码简洁性。

运算符 例子 等价于 运算结果
= y = 6 y = 6 y = 6
+= y += 1 y = y + 1 y = 7
-= y -= 1 y = y - 1 y = 5
*= y *= 2 y = y * 2 y = 12
/= y /= 2 y = y / 2 y = 3
%= y %= 4 y = y % 4 y = 2

赋值运算可以嵌套使用,例如:

y = (x = 2) + 5; // 此时 x=2, y=7

比较运算符

比较运算符用于比较两个值的大小或相等性,通常返回布尔值(Boolean)。在处理不同类型的数据时,选择正确的相等性判断至关重要。

运算符 说明 例子 运算结果
== 等于(仅比较值,会进行类型转换) 2 == 2 true
=== 全等于(值和类型均需一致) 2 === "2" false
!= 或 <> 不等于 2 != 3 true
!== 不全等于 2 !== "2" true
> 大于 2 > 3 false
< 小于 2 < 3 true
>= 大于等于 2 >= 3 false
<= 小于等于 2 <= 3 true

比较运算符同样适用于字符串的字典序比较。

三元运算符

三元运算符是 JavaScript 中唯一的需要三个操作数的运算符,常作为 if-else 语句的简写形式,使条件赋值更加紧凑。

基本语法

(condition) ? expr1 : expr2

运行逻辑:如果 condition 求值为 true(真),则整个表达式的结果为 expr1;否则,结果为 expr2。

应用示例

x = 2;
y = (x == 2) ? x : 1;
console.log(y); // 输出:2,因为 x确实等于2,故取第一个表达式的值

提示:为避免优先级引发的歧义错误,建议将各个表达式用括号括起来。

逻辑运算符

逻辑运算符用于组合多个布尔表达式,根据运算规则返回最终的真假结果。

运算符 说明 例子 运算结果
&& 逻辑与(AND) x=2; y=6; x && y > 5 false
|| 逻辑或(OR) x=2; y=6; x < 5 || y < 5 true
! 逻辑非(NOT) x=2; y=6; !(x > y) true

字符串连接运算符

在 JavaScript 中,+ 运算符具有双重作用:数字相加和字符串连接。当至少有一个操作数为字符串时,该运算符会将另一个操作数转换为字符串并执行拼接操作。

// 纯字符串拼接
let str1 = "Hello ";
let result = str1 + "World!"; // "Hello World!"

// 字符串与数字混合
let num = 25;
let message = "我今年" + num + "岁"; // "我今年25岁"(数字自动转为字符串)

如果希望字符串之间有空格分隔,必须显式地在字符串常量中添加空格。

总结

理解这六大类运算符的工作机制是编写正确 JavaScript 代码的前提。特别是区分相等性判断(== vs ===)以及理解运算过程中的类型隐式转换,能够有效避免常见的逻辑 Bug。以上就是 JavaScript 中6种核心运算符的详细内容,更多关于前端开发的资料请关注本站其它相关文章!

相关标签:

免责声明:本文内容仅供参考,不代表本站观点。转载或引用请注明出处。

Python 相关产品和应用

全部下载
Selenium

Selenium

4.51.0 · Windows

用于浏览器自动化和 Web 测试的 Python 工具。

scikit-learn

scikit-learn

1.9.1 · Windows

常用 Python 机器学习算法与模型评估工具库。

Black

Black

26.10.1 · Windows

强调一致性的 Python 自动代码格式化工具。

Ruff

Ruff

0.17.1 · macOS

由 Rust 编写的高速 Python 代码检查和格式化工具。

pytest

pytest

9.1.1 · Windows

简洁而强大的 Python 自动化测试框架。

FastAPI

FastAPI

0.146.0 · Windows

高性能 Python API 框架,支持类型提示和自动接口文档。

Flask

Flask

3.1.3 · Windows

轻量灵活的 Python Web 应用框架。

Django

Django

6.1.2 · Windows

成熟的 Python Web 框架,适合构建内容站点和业务系统。

Spyder

Spyder

6.1.7 · Windows

面向科学计算与数据分析的 Python 集成开发环境。

SciPy

SciPy

1.18.1 · Windows

面向科学、工程和技术计算的 Python 算法库。