JavaScript 中处理 null和 undefined的常见方法
1.可选链操作符（?.）
const user = {
address: {
city: "Beijing"
}
};
console.log(user.address?.city); // 输出 "Beijing"
console.log(user.unknown?.city); // 输出 undefined当链式查找不到下一个属性时候，就会返回undefined
2.空值合并操作符（??）
当??的左侧值为 null 或 undefined的时候 就会取到右侧的 默认值
console.log(null ?? "default"); // 输出 "default"
console.log(undefined ?? "default"); // 输出 "default"
console.log("Hello" ?? "default"); // 输出 "Hello"
console.log("" ?? "default"); // 输出 ""
console.log(0 ?? "default"); // 输出 0
console.log(false ?? "default"); // 输出 false
console.log(false || "default"); // 输出 default注意??和||的区别??：仅仅在 null 和 undefined 时返回 defaultValue||:不仅会在 null 和 undefined 时返回 defaultValue，也会在 false, 0, '' (空字符串) 等其他假值情况下返回默认值defaultValue
3.优化判断
一般在判断if语句时候，经常会有类似的判断。
if(a.aa === undefined || a.aa === null || a.aa === ''){
}是的，可以通过使用更简洁和可读性更高的方式来优化这种判断。以下是几种常见的优化方法：
3.1 使用 == 进行宽松比较
使用宽松相等运算符 == 可以同时检查 undefined 和 null：
if (a.aa == null || a.aa === '') {
// 处理逻辑
}3.2 使用逻辑非运算符 !
可以利用逻辑非运算符 ! 来检查 falsy 值（如 undefined、null、''、0、NaN 和 false）：
if (!a.aa) {
// 处理逻辑
}不过要注意，这种方式会将所有 falsy 值都视为 true，如果你需要排除 0 或 false，则不适用。
3.3 使用可选链和空值合并运算符
结合可选链操作符和空值合并运算符，可以更加简洁：
if (a.aa?.trim() === '') {
// 处理逻辑
}3.4 使用自定义函数
如果这种检查在多个地方使用，可以考虑封装成一个函数：
function isEmpty(value) {
return value == null || value === '';
}
if (isEmpty(a.aa)) {
// 处理逻辑
}总结
选择哪种方式取决于具体的需求和上下文。使用 ! 运算符是最简洁的，但需要确保不会误判其他 falsy 值。如果需要更严格的检查，使用 == 或自定义函数可能更合适。
到此这篇关于JavaScript 中处理 null和 undefined情况分析的文章就介绍到这了,更多相关js处理null和underfined内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
变量是存储信息的容器(JS的变量名是区分大小写的),下面这篇文章主要给大家介绍了关于JS进阶指南之变量和类型的相关资料,文章通过实例代码介绍的非常详细,需要的朋友可以参考下2022-05-05
判断两个对象是否相等是js中的一个很常见的内容,不同的编程语言和环境可能会有不同的方式来实现这一目标,在 JavaScript 中,判断两个对象是否相等主要有以下几种方法,感兴趣的小伙伴跟着小编一起来看看吧2024-08-08
在JavaScript中使用严格模式(Strict Mode)
这篇文章主要介绍了在JavaScript中使用严格模式(Strict Mode),除了正常运行模式，ECMAscript 5添加了第二种运行模式："严格模式"（strict mode）。顾名思义，这种模式使得Javascript在更严格的条件下运行。,需要的朋友可以参考下2019-06-06
这篇文章主要介绍了JavaScript中==与+的使用方法，帮助大家更好的理解和学习JavaScript，感兴趣的朋友可以了解下2020-08-08
JavaScript中双等号(==)和三等号(===)有何不同以及何时使用它们详解
这篇文章主要给大家介绍了关于JavaScript中双等号(==)和三等号(===)有何不同以及何时使用它们的相关资料,在JavaScript中"=="和"==="都是比较运算符,用于比较两个值是否相等,需要的朋友可以参考下2024-01-01
好久没写了。感觉今时今日，HTML5 还依然只是一种玩票的东东。但愿 w3c 的标准可以早一点出台，不要让各种浏览器的兼容问题和支持程度搞死2011-11-11
这篇文章主要介绍了浅谈如何使用webpack构建多页面应用，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-05-05
本文梳理lodash中那些高频使用的超究极无敌好用方法,熟练使用下面的十个方法能够让你的代码原地起飞,为你的开发之旅极大的减轻心智负担,快跟随小编一起学习一下吧2024-01-01
JavaScript 严格模式(use strict)用法实例分析
这篇文章主要介绍了JavaScript 严格模式(use strict)用法,结合实例形式分析了JavaScript 严格模式的基本功能、用法及操作注意事项,需要的朋友可以参考下2020-03-03
这篇文章主要介绍了如何使用javscript实现滚动条滚动到页面底部自动加载增加页面内容,需要的朋友可以参考下2014-05-05
最新评论