定位 NaN 污染源需从源头校验、断点监视、工具预防三方面入手：对外部数据用 Number.isFinite() 校验；在 DevTools Watch 面板追踪首次 NaN；通过 ESLint 和封装 safeAdd 等函数提前拦截。
遇到计算结果突然变成 NaN，往往不是某一步出错，而是更早的某个值被隐式转成了 NaN，之后所有基于它的运算（加减乘除、比较等）都会持续传播 NaN。关键不是“怎么修”，而是“怎么快速定位那个最初的污染源”。
从源头拦截：在关键输入处主动校验类型和有效性
很多 NaN 来自字符串解析失败（如 parseInt("abc") → NaN）、空值参与运算（null + 1 → 1，但 undefined + 1 → NaN），或意外传入非数字值。不要等到计算崩溃才察觉。
- 对用户输入、接口返回、表单字段等外部数据，在赋值给数值变量前，用
Number.isFinite()或typeof x === 'number' && !isNaN(x)显式判断 - 避免直接用
+或parseInt/parseFloat转换可能为空或格式错误的字符串；优先用Number(str)并立刻检查结果是否为有效数字 - 例如：❌
const price = +input.value;→ 若 input 为空或含空格，price就是NaN；✅ 改为const price = Number(input.value.trim()); if (!Number.isFinite(price)) throw new Error('价格无效');
用断点+表达式监视器揪出第一个 NaN 出现的位置
Chrome / Edge 的 DevTools 是最直接的工具。不要靠肉眼扫代码，而要让执行过程“开口说话”。
- 在疑似涉及数值计算的函数入口或循环体中打上断点
- 打开“Watch”面板，手动添加你关心的变量（如
a,b,a + b），观察它们何时首次变为NaN - 特别注意那些看似无害的操作：比如
arr.reduce((sum, x) => sum + x, 0)—— 如果数组里混入了undefined或字符串"--"，第一次累加就产出NaN，后续全崩
启用严格模式 + 启用 ESLint 规则预防常见陷阱
有些隐式转换问题在开发阶段就能拦住，不用等到运行时。
- 开启
"use strict"，它会让部分危险操作抛出错误（虽然不直接捕获NaN，但能减少undefined意外参与运算的场景） - 配置 ESLint 插件（如
eslint-plugin-no-implicit-coercion或eslint-plugin-unicorn），启用规则如no-implicit-coercion（禁止用+转字符串/数字）、no-useless-concat等，提前标出易出错写法 - 对数学计算逻辑单独封装校验函数，比如：
function safeAdd(a, b) { if (!Number.isFinite(a) || !Number.isFinite(b)) throw new TypeError(`Invalid operand: ${a}, ${b}`); return a + b; }
利用控制台技巧快速扫描可疑值
当 bug 复现后，别急着改代码，先用几行命令快速探查。
- 在控制台执行
console.log(JSON.stringify(obj, (k, v) => typeof v === 'number' && !isFinite(v) ? `NaN@${k}` : v, 2))，可高亮显示对象中所有NaN字段及其路径 - 对数组批量检查：
[1, 2, "3", null, undefined, "abc"].map((x, i) => ({ i, x, type: typeof x, isNum: Number.isFinite(Number(x)) }))，一眼看出哪个元素无法安全转数 - 临时重写全局
isNaN（仅调试用）：window.isNaN = new Proxy(window.isNaN, { apply: (t, _, [v]) => { if (typeof v === 'number' && isNaN(v)) console.trace('NaN generated from:', v); return t(v); } });
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
