JavaScript数据类型校验需分层设防：先检查null/undefined存在性，再验证字符串非空、数字合法、对象结构完整；用户输入必trim，数字用Number.isInteger等严格判断，避免隐式转换。
JavaScript 中数据类型的安全校验不是靠“猜”或简单用 typeof 就能兜底的，而是要结合场景、明确意图、分层设防：既要防止 null/undefined 导致运行时崩溃，也要拦截空格字符串、非法数字、错误结构等“看似存在实则无效”的值。
区分“存在性”与“有效性”
很多 bug 源于混淆这两个概念。比如：
-
存在性校验：检查变量是否为
null或undefined（即是否“有值”） - 有效性校验：确认值不仅存在，还符合业务要求（如字符串非空白、数字在合理范围内、对象有必需字段）
推荐写法：
function isNonEmptyString(val) {
return typeof val === 'string' && val.trim().length > 0;
}
function isPositiveInteger(val) {
return Number.isInteger(val) && val > 0;
}
处理用户输入：必须过 trim() 这一道关
表单中 .value 返回的永远是字符串，哪怕用户只敲了空格、制表符或换行符——这些都不是 ''，但业务上就是“空”。直接用 !val 会漏判。
立即学习“Java免费学习笔记（深入）”；
正确做法：
JavaStoryDevelop
下载
你接手一个需求时，是不是经常这样："改一个小字段 → 结果把不相关的代码也改了"、"需求说得很模糊 → 做着做着发现跑偏了"、"数据库加个字段 → 上线才发现漏了数据兼容"、"做了个新功能 → 一个月后自己都忘了当时怎么设计的"、"写到一半被中断 → 再回来不知道从哪继续"；这个 Skill 就是专门解决这些问题的。 它会自动探测你的项目环境（JDK、Spring Boot、ORM、数据库、前端框架），记在
- 对所有文本输入先调用
.trim() - 再判断长度是否大于 0
- 避免用
==或!=做类型宽松比较（如'' == 0为 true）
示例：
const input = document.querySelector('#username').value;
if (!isNonEmptyString(input)) {
alert('用户名不能为空');
return;
}
结构化数据（对象/数组）用验证函数兜底
从 API 接口、localStorage 或 JSON.parse 得到的数据，表面是对象，实际可能字段缺失、类型错乱。不能只靠 typeof obj === 'object'。
建议方式：
- 定义最小必要结构（如
{ id: number, name: string }） - 手写轻量验证函数，逐字段检查类型 + 必填性
- 复杂项目可引入
protobuf.js的Message.verify()或zod/yup等运行时 schema 工具
简易对象校验示例：
function isValidUser(data) {
return data &&
typeof data.id === 'number' &&
isNonEmptyString(data.name) &&
Array.isArray(data.roles);
}
数字与布尔值别信 parseInt 和 !!
parseInt('12px') 返回 12，!!'0' 是 true —— 这些都是陷阱。
安全替代方案：
- 数字：优先用
Number()+isNaN()，或更严格的Number.isFinite()、Number.isInteger() - 布尔：明确约定字符串
'true'/'false'才转布尔，否则用严格相等=== true或=== false - 避免隐式转换，如
value || 'default'在0、false、''场景下会误触发
