JavaScript 逻辑赋值运算符(=,||=,??=)与可选链运算符(?. ??)

一、 短路运算

短路运算是一种常见的逻辑运算方式,其核心机制是在运算过程中进行一些优化和简化,从而提高计算效率和减少资源消耗。特别是在处理逻辑与(&&)和逻辑或(||)运算时,如果左侧的表达式已经能够确定整个逻辑表达式的结果,那么右侧的表达式将不会被执行,因此任何与其求值产生的相关副作用都不会生效。

二、 逻辑赋值运算符

  • &&=:逻辑与赋值运算符 x &&= y 等价于 x && (x=y):意思是当 x 为真时,x = y。
  • ||=:逻辑或赋值运算符 x ||= y 等价于 x || (x = y):意思是仅在 x 为 false 的时候,x = y。
  • ??=:逻辑空赋值运算符 x ??= y 等价于 x ?? (x = y):意思是仅在 x 为 null 或 undefined 的时候,x = y
//&&=
let a = 1;
a &&= 2;
console.log(a); // 2
//||=
const aa = { duration: 50, title: '' };
aa.duration ||= 10;
console.log(aa.duration);  // 50
aa.title ||= 'title is empty.';
console.log(aa.title);  // "title is empty"
//??=
const a = { duration: 50 };
ac.duration ??= 10;
console.log(ac.duration);  // 50
ac.speed ??= 25;
console.log(ac.speed);  // 25

常见应用

  • 用于条件判断、链式判断以及空指针判断等场景。例如,在判断一个对象是否为空以及其属性是否满足特定条件时,可以使用短路运算来避免空指针异常。
  • 进行复杂的条件判断时,如果某个关键条件不满足(即为假),则后续的条件判断可以省略,从而提高代码执行效率。

使用示例

在日常开发中,像以现一些代码是可以用逻辑赋值运算符代替

// 给data.code为空时,赋值为y
// 示例1
if (!data.code) {
data.code= y
}
// 示例2
data.code? "" : (data.code = y)

可以使用逻辑与替代

data.code ||= y

三、其他常用运算符

1. 空值合并运算符(??)

空值合并运算符(??)是一个逻辑运算符,当左侧的操作数为 null 或者 undefined 时,返回其右侧操作数,否则返回左侧操作数。
与逻辑或运算符(||)不同,逻辑或运算符会在左侧操作数为假值时返回右侧操作数。也就是说,如果使用 || 来为某些变量设置默认值,可能会遇到意料之外的行为。比如为假值(例如,‘’ 或 0)时。见下面的例子。

const foo = null ?? 'default string';
console.log(foo);
// Expected output: "default string"const baz = 0 ?? 42;
console.log(baz);
// Expected output: 0

为变量赋默认值
由于 || 是一个布尔逻辑运算符,左侧的操作数会被强制转换成布尔值用于求值。任何假值(0, ‘’, NaN, null, undefined)都不会被返回。这导致如果你使用0,''或NaN作为有效值,就会出现不可预料的后果。

let count = 0;
let text = "";
let qty = count || 42;
let message = text || "hi!";
console.log(qty); // 42,而不是 0
console.log(message); // "hi!",而不是 ""// An empty string (which is also a falsy value)
let myText = ""; 
let notFalsyText = myText || "Hello world";
console.log(notFalsyText); // Hello world
let preservingFalsy = myText ?? "Hi neighborhood";
console.log(preservingFalsy); // '' (as myText is neither undefined nor null)

2. 可选链运算符(?.)

可选链运算符(?.)允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。
?. 运算符的功能类似于 . 链式运算符,不同之处在于,在引用为空 (nullish ) (null 或者 undefined) 的情况下不会引起错误,该表达式短路返回值是 undefined。

let potentiallyNullObj = null;
let x = 0;
let prop = potentiallyNullObj?.[x++];
console.log(x); // x 将不会被递增,依旧输出 0

可以结合空值合并运算符设置默认值
空值合并运算符针对 undefined 与 null 这两个值,可选链式运算符(?.) 也是如此。在访问属性可能为 undefined 与 null 的对象时,?.与??结合使用非常有用。

let customer = {name: "Carl",details: { age: 82 },
};
let customerCity = customer?.city ?? "暗之城";
console.log(customerCity); // “暗之城”

可选链不能用于赋值
需要注意的是时,可选链是不用用于赋值对象的

let object = {};
object?.property = 1; // Uncaught SyntaxError: Invalid left-hand side in assignment

3、TypeScript中的非空断言操作符(!)

由于可选链不能用于赋值,所以在没有属性接口或类型定义的情况下,如何给没有明确属性定义的对象赋值呢?

let object=await getObject();
object!.code='A001'

! 是TypeScript中的非空断言操作符。它告诉TypeScript编译器,尽管从静态类型检查的角度来看,code 属性可能是 null 或 undefined,但在实际运行时,你确信它不是。这通常是因为你确信在某个特定的代码执行路径中,该属性已经被正确地初始化了。
使用非空断言操作符需要谨慎,因为它可能会掩盖潜在的错误。如果你断言了一个实际上可能是 null 或 undefined 的值,那么在运行时可能会出现错误。为了避免这种情况,你可能需要在赋值之前添加一些额外的检查。

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

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

相关文章

在3dmax软件中如何快速创建毛发?---模大狮模型网

在3D建模和渲染中,为角色或物体添加逼真的毛发效果是提升场景真实感的重要步骤之一。然而,手动一根一根创建毛发是非常繁琐的,因此掌握如何在软件中快速生成和调整毛发效果至关重要。模大狮将详细介绍如何利用3ds Max 2018创建毛发&#xff0…

Sip协议(二)

Sip协议(二) 本文继续介绍Sip协议,主要介绍Sip请求 INVITE. 1: INVITE请求 下面是一个简单的例子: INVITE sip:xxx100.100.0.1 SIP/2.0 Via: SIP/2.0/TCP 发起者IP:40852;rport;branchz9hG4bK64259 Max-Forwards: 70 To: <sip:xxxx100.100.0.1> From: <sip:xxx100…

面试_多线程

线程池 线程池的参数有哪些 线程池七大参数分别是corePoolSize、maximumPoolSize、keepAliveTime、unit、workQueue、threadFactory、handler corePoolSize&#xff1a;线程池中常驻核心线程数maximumPoolSize&#xff1a;线程池能够容纳同时执行的最大线程数keepAliveTime&…

Salia PLCC cPH2 远程命令执行漏洞(CVE-2023-46359)

漏洞描述 Salia PLCC cPH2 v1.87.0 及更早版本中存在一个操作系统命令注入漏洞&#xff0c;该漏洞可能允许未经身份验证的远程攻击者通过传递给连接检查功能的特制参数在系统上执行任意命令。 产品界面 fofa语法 "Salia PLCC" POC GET /connectioncheck.php?ip1…

前端开发之DNS协议

上一篇&#x1f449;: 前端开发之计算机网络模型认识 文章目录 DNS协议详介绍1. DNS 协议概述2. DNS协议与TCP/UDP3. DNS查询过程4. 迭代与递归查询5. DNS记录与报文结构资源记录类型对比 6. 总结 DNS协议详介绍 1. DNS 协议概述 DNS&#xff08;Domain Name System&#xf…

如何使用React的Context API来实现跨组件的状态共享?

在React中&#xff0c;Context API是一种用于跨组件共享状态的方法。以下是使用React的Context API实现跨组件状态共享的基本步骤&#xff1a; 创建Context&#xff1a;首先&#xff0c;你需要创建一个Context对象。可以使用React.createContext()方法来创建一个新的Context实…

UVa12227/LA4618 Wormholes

UVa12227/LA4618 Wormholes 题目链接题意分析测试数据AC 代码 题目链接 本题是2009年icpc欧洲区域赛西北欧赛区的j题 UVA - 12227 Wormholes 题意 你有一艘星际飞船&#xff0c;飞船运行速度为1&#xff0c;打算从坐标a旅行到坐标b&#xff08;出发时刻为0&#xff09;&#x…

线程池的艺术:深度解析Java多线程并发性能的优化之道

1. 引言 在高并发的Java应用开发中,线程池作为管理和复用线程资源的核心机制,扮演着举足轻重的角色。合理、高效地使用线程池不仅能减少资源消耗、提高系统响应速度,还能有效控制并发线程数量,保证系统的稳定性和性能。 2. 线程池的基本概念与优势 线程池是一种管理和复用…

发论文idea来了!强化学习+Transformer,29个创新点汇总

基于Transformer的强化学习&#xff08;TRL&#xff09;是一种利用Transformer模型架构来改进和增强强化学习算法性能的方法。 这种方法通过结合Transformer模型强大的表示能力和强化学习的决策优化框架&#xff0c;显著提升了智能体的学习能力和适应能力&#xff0c;为我们解…

dockerfile文件的中的命令

# 基础镜像 FROM registry.cn-beijing.aliyuncs.com/205erp/myopenjdk:8.6 # 设置工作目录 WORKDIR /opt # 拷贝jar包到工作目录 COPY target/*.jar app.jar RUN ls # 设置暴漏的端口 EXPOSE 8080 # 启动jar包 CMD java ${JAVA_TOOL_OPTIONS} -jar app.jar

N7745A Keysight 是德 多端口光功率计 简述

N7745A光功率计专为表征多端口光器件而设计&#xff0c;适用于多路复用器、PON分路器、波长选择开关&#xff08;WSS&#xff09;和ROADM等多端口器件的测试。它可以节省通道空间&#xff0c;通过LAN或USB连接进行并行编程&#xff0c;集成多种设备到单一设置&#xff0c;提高了…

Android C++系列:函数知识知多少

1. 背景 函数可以理解为功能的封装&#xff0c;很基础的功能单元&#xff0c;但是因为它虽然看似简单&#xff0c;但是里面涉及了不少知识点和技巧&#xff0c;我们花一篇文章来整理。 2. 函数定义 函数有以下几部分定义&#xff1a; 返回类型函数名称形参列表函数体 函数…

企业设备管理现状与解决方案

在当今企业运营中&#xff0c;设备管理作为保障生产稳定、提升效率的重要环节&#xff0c;其复杂性和挑战性日益凸显。无论是生产车间、石油化工、物业小区&#xff0c;还是消防器材、建筑施工等领域&#xff0c;都面临着设备故障频发、维修流程繁琐等共性问题。 为了帮助企业…

Shell编程练习:掌握命令行的魔法

1、编写一个 shell 脚本&#xff0c;它把第二个位置参数及其以后的各个参数指定的文件复制到第一个位置参数指定的目录中。 #!/bin/bash# 检查是否提供了至少两个参数 if [ "$#" -lt 2 ]; thenecho "使用方法: $0 目标目录 文件..."exit 1 fi# 第一个位置…

6.19作业

TCP服务器 #include <stdio.h> #include <sys/types.h> #include <sys/socket.h> #include <unistd.h> #include <arpa/inet.h> #include <netinet/in.h> #include <string.h>#define PORT 8888 #define IP "192.168.124.39&q…

VUE3实现个人网站模板源码

文章目录 1.设计来源1.1 网站首页页面1.2 个人工具页面1.3 个人日志页面1.4 个人相册页面1.5 给我留言页面 2.效果和源码2.1 动态效果2.2 目录结构 源码下载万套模板&#xff0c;程序开发&#xff0c;在线开发&#xff0c;在线沟通 作者&#xff1a;xcLeigh 文章地址&#xff1…

对比4090及4090D:国区“特供”与原版相比有何区别?

2023年12月28日 英伟达宣布正式发布GeForce RTX 4090D&#xff0c;对比于一年前上市的4090芯片&#xff0c;两者的区别与差异在哪&#xff1f;而在当前比较火热的大模型推理、AI绘画场景方面 两者各自的表现又如何呢&#xff1f; 规格与参数信息对比现在先来看看GeForce RT…

SCI绘图【1】-不同颜色表示密度和差异--密度图

参考资料&#xff1a;密度图&#xff08;Density Plot&#xff09; - 数据可视化图表 - 数字孪生百科 密度图是快速观察变量数值分布的有效方法之一。通常情况下&#xff0c;会根据两个变量将平面绘图区域分为非常多的子区域&#xff0c;之后以不同颜色表示落在该区域上样本的…

揭秘!家用空气净化器针对“毛絮、灰尘”的制胜秘诀是什么?

亲爱的朋友们&#xff01;作为一个家庭主妇&#xff0c;我想和大家聊聊我日常生活中那些让人头疼的飞尘和毛絮问题。 每天忙得团团转&#xff0c;累得腰酸背痛&#xff0c;但家里仍然飘着那些烦人的飞尘和毛絮。它们就像一群顽皮的小精灵&#xff0c;四处飞舞&#xff0c;怎么…

《2024攻防演练必修高危漏洞集合》

1 漏洞汇总数据 以下数据针对自2024年3月以来截止到目前在攻防演练过程红队利用率比较高的漏洞进行总结汇总&#xff0c;具体的数据如下所示&#xff1a; ●远程代码执行漏洞 漏洞数量&#xff1a;6个 涉及厂商&#xff1a;YzmCMS、畅捷通、pgAdmin、泛微、锐捷、奇安信、 ●…