js如何判空?

在 JavaScript 中,判空(检查变量是否为"空"值)需要针对不同数据类型进行区分。根据你的需求,"空"包括:空数组、空对象、空字符串、0、undefined、null、空 Map、空 Set。

1. 严格判空(仅 null 或 undefined)

javascript 复制代码
if (value == null) { // 等价于 value === null || value === undefined
    console.log("值为 null 或 undefined");
}

2. 宽松判空(包括空字符串、空数组、空对象等)

方法 1:自定义 isEmpty 函数

javascript 复制代码
function isEmpty(value) {
    return (
        value == null || // null 或 undefined
        (typeof value === "string" && value.trim() === "") || // 空字符串或全空格
        (Array.isArray(value) && value.length === 0) || // 空数组
        (typeof value === "object" && Object.keys(value).length === 0) || // 空对象
        (value instanceof Map && value.size === 0) || // 空 Map
        (value instanceof Set && value.size === 0) // 空 Set
        // 注意:0 不算空,除非额外处理
    );
}

// 测试
console.log(isEmpty(null)); // true
console.log(isEmpty(undefined)); // true
console.log(isEmpty("")); // true
console.log(isEmpty("   ")); // true
console.log(isEmpty([])); // true
console.log(isEmpty({})); // true
console.log(isEmpty(new Map())); // true
console.log(isEmpty(new Set())); // true
console.log(isEmpty(0)); // false(默认不算空,除非修改逻辑)

方法 2:如果 0 也算空

javascript 复制代码
function isEmpty(value) {
    return (
        value == null ||
        (typeof value === "string" && value.trim() === "") ||
        (Array.isArray(value) && value.length === 0) ||
        (typeof value === "object" && Object.keys(value).length === 0) ||
        (value instanceof Map && value.size === 0) ||
        (value instanceof Set && value.size === 0) ||
        value === 0 // 0 也算空
    );
}

console.log(isEmpty(0)); // true

3. 特殊情况处理

(1)0 是否算空?

  • 默认情况下,0 是一个有效的数字,不算空。
  • 如果业务上需要 0 也算空,可以在 isEmpty 里加上 value === 0。

(2)false 是否算空?

  • false 是布尔值,通常不算空,除非特别处理。

(3)NaN 是否算空?

  • NaN 是无效数字,可以额外判断:
javascript 复制代码
Number.isNaN(value)

4. 完整判空方案(推荐)

javascript 复制代码
function isEmpty(value, treatZeroAsEmpty = false) {
    return (
        value == null ||
        (typeof value === "string" && value.trim() === "") ||
        (Array.isArray(value) && value.length === 0) ||
        (typeof value === "object" && Object.keys(value).length === 0) ||
        (value instanceof Map && value.size === 0) ||
        (value instanceof Set && value.size === 0) ||
        (treatZeroAsEmpty && value === 0) // 可选:0 是否算空
    );
}

// 使用
console.log(isEmpty(0)); // false
console.log(isEmpty(0, true)); // true(0 算空)

5. 总结

数据类型 判空方式
null / undefined value == null
空字符串 "" value === "" 或 value.trim() === ""
空数组 [] Array.isArray(value) && value.length === 0
空对象 {} Object.keys(value).length === 0
空 Map value instanceof Map && value.size === 0
空 Set value instanceof Set && value.size === 0
0 默认不算空,除非额外处理
false 通常不算空
NaN Number.isNaN(value)

6. 最终推荐

javascript 复制代码
function isEmpty(value, options = { treatZeroAsEmpty: false }) {
    return (
        value == null ||
        (typeof value === "string" && value.trim() === "") ||
        (Array.isArray(value) && value.length === 0) ||
        (typeof value === "object" && Object.keys(value).length === 0) ||
        (value instanceof Map && value.size === 0) ||
        (value instanceof Set && value.size === 0) ||
        (options.treatZeroAsEmpty && value === 0)
    );
}
相关推荐
于慨21 小时前
Lambda 表达式、方法引用(Method Reference)语法
java·前端·servlet
石小石Orz21 小时前
油猴脚本实现生产环境加载本地qiankun子应用
前端·架构
从前慢丶21 小时前
前端交互规范(Web 端)
前端
@yanyu66621 小时前
07-引入element布局及spring boot完善后端
javascript·vue.js·spring boot
CHU72903521 小时前
便捷约玩,沉浸推理:线上剧本杀APP功能版块设计详解
前端·小程序
GISer_Jing21 小时前
Page-agent MCP结构
前端·人工智能
王霸天21 小时前
💥别再抄网上的Scale缩放代码了!50行源码教你写一个永不翻车的大屏适配
前端·vue.js·数据可视化
小领航21 小时前
用 Three.js + Vue 3 打造炫酷的 3D 行政地图可视化组件
前端·github
@大迁世界21 小时前
2026年React大洗牌:React Hooks 将迎来重大升级
前端·javascript·react.js·前端框架·ecmascript
PieroPc21 小时前
一个功能强大的 Web 端标签设计和打印工具,支持服务器端直接打印到局域网打印机。Fastapi + html
前端·html·fastapi