登录
首页 >  文章 >  前端

可选链与空值合并,JS新特性详解

时间:2025-12-13 10:15:51 318浏览 收藏

推广推荐
免费电影APP ➜
支持 PC / 移动端,安全直达

本篇文章向大家介绍《可选链与空值合并,JavaScript新特性解析》,主要包括,具有一定的参考价值,需要的朋友可以参考一下。

可选链(?.)允许安全访问嵌套属性,若中间节点为null或undefined则返回undefined而不报错;空值合并(??)在左侧值为null或undefined时使用右侧默认值,且不影响0、false等假值;两者结合如user?.address?.street ?? '未知地址',可简洁实现安全取值与默认回退。

JavaScript可选链操作_NullishCoalescing

JavaScript中的可选链(Optional Chaining)和空值合并(Nullish Coalescing)是ES2020引入的两个非常实用的特性,它们能帮助开发者更安全、简洁地处理可能为nullundefined的情况。

可选链操作符(?.)

可选链允许你读取嵌套对象属性时,无需每次都检查中间节点是否存在。如果某个层级为nullundefined,表达式会短路并返回undefined,而不会抛出错误。

常见使用场景:

  • 访问深层对象属性:user?.address?.street,若useraddress为空,结果为undefined,不报错。
  • 调用可能不存在的方法:func?.(),只有func存在且为函数时才会执行。
  • 访问数组元素:arr?.[0],避免arr未定义导致的错误。

空值合并操作符(??)

空值合并用于在左侧值为nullundefined时,使用右侧的默认值。它与逻辑或(||)不同,??仅在值真正“空”时才替换,不会影响0false、空字符串等“假值”。

对比示例:

  • const count = userCount || 10; —— 若userCount0,也会使用10
  • const count = userCount ?? 10; —— 只有当userCountnullundefined时才用100会被保留。

结合使用更强大

这两个操作符常一起使用,构建更健壮的默认值逻辑。

例如:

const street = user?.address?.street ?? '未知地址';

这行代码先通过可选链安全读取street,若路径中断或最终值为空,则使用默认值。

基本上就这些,写得干净点,代码自然少出错。

今天关于《可选链与空值合并,JS新特性详解》的内容介绍就到此结束,如果有什么疑问或者建议,可以在golang学习网公众号下多多回复交流;文中若有不正之处,也希望回复留言以告知!

相关阅读
更多>
最新阅读
更多>
课程推荐
更多>