别再死记硬背了,一篇文章搞懂 JS 乘性操作符



想象一下。在 JavaScript 世界里,有一家非常忙碌的工厂,名字叫 Number Factory 。这家工厂每天的工作就是------处理各种数字请求

有的请求很简单:

"帮我算一下 2 × 3。"

有的请求就很奇怪:

"帮我算一下 '6' * '2'。"

"那 null / 5 呢?"

"true % 2 会剩下什么?"

于是,工厂门口站着三位老员工:

  • **乘法操作符 *** ------ 力气最大
  • 除法操作符 / ------ 切得最细
  • 取模操作符 % ------ 专门管"剩下多少"

今天,我们就以数字工厂的一天 为主线,把 JavaScript 的乘性操作符彻底讲透。

什么是乘性操作符?

在 JavaScript 中,乘性操作符(Multiplicative Operators) 一共有三个:

听起来是不是很简单?

别急。 JavaScript 的精髓,从来不在"能算",而在------它是怎么帮你算的

乘法操作符 *:力气最大的老员工

1、最普通的乘法

这是最常见的用法:

没什么好说的,对吧?但 JavaScript 从不满足于"普通"。

2、字符串 × 数字:先换工服再干活

在数字工厂里,只要你拿着 * 进门,不管你是谁,都得先换成 Number 工服

规则很明确:乘法操作符会把操作数隐式转换成 Number 类型

但如果换不了呢?

3、换不了工服的下场:NaN

在工厂里,'abc' 被领到更衣室一看:"兄弟,你这不是数字啊。"

于是结果直接变成:

4、特殊值参与乘法

我们来看一张非常重要的表:

示例代码:

面试高频点:null 在数值运算中,几乎总是 0。

除法操作符 /:切得最细的老员工

如果说乘法是"使劲干活",那除法就是------精细分配

1、基本除法

JavaScript 的除法,默认是浮点除法,不会像某些语言那样自动取整。

2、被除数是 0?故事开始刺激了

在数字工厂里,除法员工遇到 0,会很冷静地说一句:"无限大。"

3、0 / 0:工厂直接宕机

规则总结一下:

4、除法中的隐式转换

和乘法一样,除法也会触发 Number 转换

规则一句话记住:乘法和除法,是 JavaScript 中最"严格"的操作符之一, 它们不玩字符串拼接,只认数字。

取模操作符 %:管"剩下多少"的老员工

终于轮到今天最容易被误解的一个了。

1、什么是取模?

取模,不是取百分比 ,而是:取除法后的余数

在数字工厂里:10 块钱,每人发 3 块,发完以后桌上还剩 1 块。

2、取模的经典应用场景

✔ 判断奇偶

这是前端面试出现频率极高的一种写法。

3、负数取模,很多人会算错

记住一个核心规则取模结果的符号,跟被除数一致

4、特殊值参与取模

对,你没看错:

  • null → 0
  • true → 1

三大操作符行为对照表(重点收藏)

这张表,我建议你直接截图:

为什么面试官爱问"乘性操作符"?

因为它表面简单,实际全是坑

  1. 隐式类型转换
  2. NaN 的传染性
  3. Infinity 的出现条件
  4. 负数取模的规则
  5. null / undefined 的差异

很多人写 JavaScript 写了好几年,却在这一块翻车。

总结

如果你今天只能记住三句话,请记住这三句:

乘法、除法、取模,都会把操作数转成 Number

转不了的,直接 NaN

取模结果的符号,永远跟被除数走

JavaScript 从来不是"随便算",而是规则清晰,只是你没系统看过

END

如果你觉得这篇文章对你有帮助,欢迎点赞、收藏、转发 给那个总是被 JS 隐式转换坑的朋友

我们,下篇见。

我是小米,一个喜欢分享技术的31岁程序员。如果你喜欢我的文章,欢迎关注我的微信公众号"软件求生",获取更多技术干货!

相关推荐
酒鼎11 分钟前
学习笔记(12-02)事件循环 - 实战案例 —⭐
前端·javascript
Bigger16 分钟前
第一章:我是如何剖析 Claude Code 整体架构与启动流程的
前端·aigc·claude
小恰学逆向22 分钟前
【爬虫JS逆向之旅】某球网参数“md5__1038”逆向
javascript·爬虫
竹林81822 分钟前
从“连接失败”到丝滑登录:我用 ethers.js v6 搞定 MetaMask 钱包连接的全过程
前端·javascript
oi..26 分钟前
《Web 安全入门|XSS 漏洞原理、CSP 策略与 HttpOnly 防护实践》
前端·网络·测试工具·安全·web安全·xss
UXbot35 分钟前
2026年AI全链路产品开发工具对比:5款从创意到上线一站式平台深度解析
前端·ui·kotlin·软件构建·swift·原型模式
一拳不是超人1 小时前
前端工程师也要懂的服务器部署知识:从 Nginx 到 CI/CD
服务器·前端
AlkaidSTART1 小时前
TanStack Query 技术指南:异步状态管理核心实践
前端·react.js
前端那点事1 小时前
前端必看!JS高频实用案例(单行代码+实战场景+十大排序)
javascript
种花家的强总1 小时前
前端项目开发/维护中降低成本的方式之一:降低耦合度
前端