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)
    );
}
相关推荐
GDAL2 小时前
js的markdown js库对比分析
javascript·markdown
石像鬼₧魂石2 小时前
Fail2ban + Nginx/Apache 防 Web 暴力破解配置清单
前端·nginx·apache
梦6502 小时前
基于Umi 框架(Ant Design Pro 底层框架)的动态路由权限控制实现方案
前端·react
weixin_464307633 小时前
设置程序自启动
前端
小满zs3 小时前
Next.js第十七章(Script脚本)
前端·next.js
小满zs4 小时前
Next.js第十六章(font字体)
前端·next.js
喝拿铁写前端9 小时前
别再让 AI 直接写页面了:一种更稳的中后台开发方式
前端·人工智能