探索JavaScript中的高效运算符:?.、||、?? 以及 ??=

探索JavaScript中的高效运算符:?.、||、?? 以及 ??=

在前端开发的日常中,我们经常需要处理各种数据逻辑,确保代码既健壮又高效。JavaScript为我们提供了一系列简洁而强大的运算符,帮助我们以更优雅的方式处理变量的空值、默认值等问题。今天,我们就来深入探讨三种这样的高效运算符:可选链操作符 ?.、逻辑或操作符 ||、空值合并操作符 ?? 以及它们的变体 ??=。这些运算符在处理不确定或可能为空的属性访问及提供默认值时尤其有用。

1. 可选链操作符 ?.

定义与用法

可选链操作符 ?. 允许你安全地访问深层嵌套的属性,而不必担心中间某个属性不存在导致的错误。如果访问路径上的任何部分为 nullundefined,整个表达式会立即短路返回 undefined 而不是抛出错误。

const user = {// profile: { email: 'example@example.com' }
};// 使用可选链,即使 profile 未定义也不会报错
const userEmail = user?.profile?.email;
console.log(userEmail); // 输出:undefined

优势

  • 减少代码冗余:避免了多次检查变量是否为 nullundefined 的需求。
  • 提升安全性:防止因访问不存在的属性而导致的运行时错误。

2. 逻辑或操作符 ||

定义与用法

逻辑或操作符 || 在JavaScript中常用于设置默认值。当操作符左侧的值被解释为“假”(如 nullundefinedfalse0、空字符串等)时,它会返回右侧的操作数。

let name = '';
const defaultName = 'Guest';// 使用逻辑或设置默认值
const displayName = name || defaultName;
console.log(displayName); // 输出:Guest

注意事项

  • 当左侧操作数为 0'' 等“假值”但实际业务场景中应被视作有效值时,使用 || 可能会导致意料之外的结果。

3. 空值合并操作符 ??

定义与用法

空值合并操作符 ?? 类似于 ||,但仅在左侧操作数为 nullundefined 时才返回右侧操作数,对于 0''false 等其他“假值”,则依然返回左侧操作数。

let age = 0;// 使用空值合并操作符设置默认值
const defaultAge = age ?? 25;
console.log(defaultAge); // 输出:0

优势

相比 ||?? 更精确地处理了“有意的空值”与“缺失的值”之间的区别,提供了更细粒度的控制。

4. 空值合并赋值操作符 ??=

定义与用法

??= 是ES2021引入的新特性,它允许你为一个可能为 nullundefined 的变量设置默认值,并直接赋值。

let score = null;
score ??= 100; // 等同于:if (score === null || score === undefined) score = 100;
console.log(score); // 输出:100

优势

  • 提高代码的简洁性和可读性,特别是在多个变量需要设置默认值的场景下。

总结

通过本文的介绍,我们了解了JavaScript中的四种高效运算符:.?||????=,它们在处理不确定数据和提供默认值方面各具特色。合理运用这些运算符,不仅可以使我们的代码更加简洁、安全,还能有效提升开发效率和代码质量。在实际开发中,根据具体场景选择最合适的运算符,将是我们提升代码健壮性的关键。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/21061.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ZCU102启动镜像(详细版)

ZCU102启动镜像--详细版本 详细步骤1、安装好Vitis(GUI界面)、 Vivado、 Petalinux软件然后vivado这边的操作就先结束了 创建Petalinux工程编译镜像打包 详细步骤 B站参考视频链接: link 1、安装好Vitis(GUI界面)、 Vivado、 Pe…

Nocobase快速上手 - 开发第一个插件

在前面的几篇博文中,记录了在Nocobase中配置collection和界面,这篇文章开始插件的开发。插件可以扩展Nocobase的业务能力,解锁更强大的功能。 环境搭建 创建插件需要配置nocobase的开发环境,笔者采用的是clone 官方代码repo的方…

使用python下载股票数据至sqlite数据库

代码下载地址: https://download.csdn.net/download/weixin_44600457/89389489

2024四川三支一扶“考生信息表”照着填❗

2024四川三支一扶“考生信息表”照着填❗ ☑️四川三支一扶开始报名,大家要按照提示如实、准确、完整填写《高校毕业生“三支一扶”计划招募考生信息表》哦~ ☑️不知道怎么填写的宝子们,可以参考图1。 ☑️毕业证书编号如实填写,若是应届生&…

Python 推导式详解:高效简洁的数据处理技巧

推导式是 Python 提供的一种简洁而强大的语法,用于创建列表、集合和字典。它可以让代码更简洁、更易读,同时提高运行效率。 基本语法 列表推导式 基本语法: [expression for item in iterable if condition]示例: # 生成平方…

【JavaEE进阶】——MyBatis操作数据库 (#{}与${} 以及 动态SQL)

目录 🚩#{}和${} 🎈#{} 和 ${}区别 🎈${}使用场景 📝排序功能 📝like 查询 🚩数据库连接池 🎈数据库连接池使⽤ 🚩MySQL开发企业规范 🚩动态sql &#x1f388…

【代码随想录算法训练Day25】LeetCode 216.组合总和III、LeetCode 17.电话号码的字母总和

Day25 回溯第二天 LeetCode 216.组合总和III 算是在上一题组合的基础上多加了一个求和的步骤&#xff0c;总体思路并没有变。 这里直接进行了剪枝操作&#xff0c;把循环的范围变了。 class Solution { private:vector<vector<int>> res;vector<int> path…

TypeScript 中的命名空间和模块化

1. 命名空间&#xff08;Namespace&#xff09; 命名空间提供了一种逻辑上的代码分组机制&#xff0c;用于避免命名冲突和将相关代码组织在一起。它使用 namespace 关键字来定义命名空间&#xff0c;并通过点运算符来访问其中的成员。例如&#xff1a; // 定义命名空间 names…

JetBrains的Ai assistant 直接激活一年的来用用

ai assistant激活成功后&#xff0c;如图 ai assistant渠道&#xff1a;https://web.52shizhan.cn/activity/ai-assistant 在去年五月份的 Google I/O 2023 上&#xff0c;Google 为 Android Studio 推出了 Studio Bot 功能&#xff0c;使用了谷歌编码基础模型 Codey,Codey 是…

[C#]使用C#部署yolov8的obb旋转框检测tensorrt模型

【测试通过环境】 win10 x64 vs2019 cuda11.7cudnn8.8.0 TensorRT-8.6.1.6 opencvsharp4.9.0 .NET Framework4.7.2 NVIDIA GeForce RTX 2070 Super 版本和上述环境版本不一样的需要重新编译TensorRtExtern.dll&#xff0c;TensorRtExtern源码地址&#xff1a;TensorRT-CShar…

微信小程序中实现录音功能及其功效

探索微信小程序录音功能&#xff1a;从实现到应用 导言 在如今的移动应用开发中&#xff0c;语音功能已经成为了不可或缺的一部分。微信小程序作为一个快速发展的平台&#xff0c;提供了丰富的 API 和功能&#xff0c;其中包括了录音功能。本文将带领你探索微信小程序中的录音…

mysql中基于规则的优化

大家好。我们在平时开发的过程中可能会写一些执行起来十分耗费性能的语句。当MySQL遇到这种sql时会依据一些规则&#xff0c;竭尽全力的把这个很糟糕的语句转换成某种可以比较高效执行的形式&#xff0c;这个过程被称作查询重写&#xff0c;今天我们就来聊一下mysql在查询重写时…

【UML用户指南】-05-对基本结构建模-类

在UML中&#xff0c;所有的事物都被建模为类。类是对词汇表中一些事物的抽象。类不是个体对象&#xff0c;而是描述一些对象的一个完整集合。 强调抽象的最重要的部分&#xff1a;名称、属性和操作 类 &#xff08;class&#xff09;是对一组具有相同属性、操作、关系和语义的对…

【2024年5月备考新增】】 考前篇(25)《必备资料(8) - 论文串讲-成本管理》

过程定义输入工具技术输出实际应用规划 成本 管理确定如何估算 预算、管理、 监督和控制项 目成本1、项目章程2、项目管理计划.进度管理计划.风险管理计划3、事业环境因素4、组织过程资产1、专家判断2、数据分析.备选方案分析3、会议1、成本管理计划1、创建成本管理计划,为估算…

【transformers】pytorch基础

传送门&#xff1a;https://transformers.run/c2/2021-12-14-transformers-note-3/ pytorch基础知识 tensor &#xff1a; 张量。 需要知道的内容&#xff1a; 张量构建张量计算自动微分形状调整广播机制索引与切片升降维度 Tensor 张量&#xff1a;理解成高纬度的向量就完…

flink Transformation算子(更新中)

flink Transformation算子部分 Transformation算子 map 该方法是将一个DataStream调用map方法返回一个新的DataStream。本质是将该DataStream中对应的每一条数据依次迭代出来&#xff0c;应用map方法传入的计算逻辑&#xff0c;返回一个新的DataStream。原来的DataStream中对…

短视频毫无营养:四川京之华锦信息技术公司

短视频毫无营养&#xff1a;现象背后的深度剖析 在数字时代&#xff0c;短视频以其短小精悍、易于传播的特点迅速崛起&#xff0c;成为社交媒体上的热门内容。然而&#xff0c;随着短视频的泛滥&#xff0c;关于其内容质量参差不齐、缺乏营养价值的争议也日益加剧。四川京之华…

SELF-RAG: Learning to Retrieve, Generate, and Critique Through Self-reflection

更多文章&#xff0c;请关注微信公众号&#xff1a;NLP分享汇 原文链接&#xff1a;ICLR2024&#xff1a;能够自我反思的SELF-RAG 下面介绍的这篇论文是最近被ICLR 2024 accepted oral&#xff0c;作者来自University of Washington & Allen Institute for AI & IBM R…

leetcode:最近的请求次数

class RecentCounter { public:RecentCounter() {cou 0;}int ping(int t) {q.push(t);while(!q.empty()){auto Front q.front();if(t-Front>3000)q.pop();else break;}return q.size();} private:int cou;queue<int> q; }; 仅个人做法&#xff0c;非最优解

postgressql——事务提交会通过delayChkpt阻塞checkpoint(9)

事务提交会通过delayChkpt阻塞checkpoint Postgresql事务在事务提交时&#xff08;执行commit的最后阶段&#xff09;会通过加锁阻塞checkpoint的执行&#xff0c;尽管时间非常短&#xff0c;分析为什么需要这样做&#xff1a; 首先看提交堆栈 #1 0x0000000000539175 in Co…