【JS】可选链运算符和空值合并运算符

news/2024/6/24 9:08:14/文章来源:https://blog.csdn.net/Supposelll/article/details/137144130

目录

  • 可选链运算符 问号点(?.)
    • 校验对象属性
    • 校验对象方法
    • 校验回调函数
    • 校验数组索引
    • 短路计算
  • 空值合并运算符 问号问号(??)
    • 与可选链操作符合作
    • 运算符顺序

可选链运算符 问号点(?.)

?.运算符与.运算符类似,可以取对象深处的属性或方法,与.不同之处在于,当引用为nullundefined时,不会引起报错。

校验对象属性

当一个对象下有很多层级,想取其深层级的子属性时,需要进行校验。

const obj = {};
const newAge = obj.name && obj.name.age;

上述代码中如果不对obj.name进行校验,若obj.namenullundefined,会报错。
可选链运算符可以简化上述操作。

const obj = {};
const newAge = obj.name?.age;

obj.name不存在,则newAge的值是undefined,不会报错。
使用可选链运算符会在尝试访问obj.name.age之前,先隐式地检查并确定obj.name既不 null 也不是 undefined。如果obj.namenull 或者 undefined,表达式将会短路计算直接返回 undefined
上述代码等价于以下代码,且不会创建临时变量。

let temp = obj.name;
const newAge = temp === null || temp === undefined ? undefined : temp.age;

校验对象方法

尝试调用对象上的一个可能不存在的函数时也可以使用可选链操作符

const obj = {};
const result = obj.fun?.()

如果fun函数不存在,也不会报错,result会返回undefined

校验回调函数

function doSomething(onContent, onError) {try {// ... do something with the data} catch (err) {onError?.(err.message); // 如果 onError 是 undefined 也不会有异常}
}

校验数组索引

let arrayItem = arr?.[3];

短路计算

如果可选链操作符左边是null或者undefined,其右边的值将不会被计算。

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

空值合并运算符 问号问号(??)

??是一个逻辑运算符,当左边是nullundefined时,返回右边的值。
||不同的是,||判断左边为false时返回右边的值,但0''都是false,所以二者行为是不同的。

const a = null ?? 'default';
console.log(a);
// 'default'const b = 0 ?? 1;
console.log(baz);
// 0

与可选链操作符合作

空值合并运算符适合用来赋默认值

const obj = {};
const newAge = obj.name?.age??18;
console.log(newAge)
//18

运算符顺序

空值合并运算符和其他逻辑运算符之间的运算优先级/运算顺序是未定义的,所以与其他运算符合并使用时需要加括号,否则会报错。

null || undefined ?? "foo"; // 抛出 SyntaxError
(null || undefined) ?? "foo"; // 返回 "foo"

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

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

相关文章

Java进阶-反射的详解与应用

本文深入探讨了Java反射机制的核心概念、应用实例及其在现代Java开发中的重要性。文章首先介绍了反射的基本原理和能力,包括在运行时动态获取类信息、操作对象字段和方法的能力。随后,通过具体代码示例,展示了如何利用反射进行字段访问、方法…

为什么有些网站会提示不安全,提示您与此网站之间建立的连接不安全

有时候当我们尝试访问一个网站时,浏览器会弹出一个警告,提示“您与此网站之间建立的连接不安全”。这是什么意思?这种网站真的不安全吗? 理解HTTP与HTTPS HTTP(超文本传输协议)是互联网上用于传输数据的基…

点点数据K参数加密逆向分析(RPC方案跟加密算法还原)

文章目录 1. 写在前面2. 接口分析3. 断点分析4. RPC调用5. 算法还原 【🏠作者主页】:吴秋霖 【💼作者介绍】:擅长爬虫与JS加密逆向分析!Python领域优质创作者、CSDN博客专家、阿里云博客专家、华为云享专家。一路走来长…

苹果上架经验分享

苹果上架要求是苹果公司对于提交应用程序到苹果商店上架的要求和规定。这些要求主要是为了保证用户体验、应用程序的质量和安全性。以下是苹果上架要求的详细介绍:1. 应用程序的内容和功能必须符合苹果公司的规 苹果上架要求是苹果公司对于提交应用程序到苹果商店上…

备战蓝桥杯---数论基础刷题1

数论在蓝桥杯上考的不多,但是这不能否定它的重要性。 1.简单的GCD的应用: 分析一下,由等差数列的性质,个数(an-a1)/d1,其中an与a1是固定的,因此我们就是让dmax,我们先排一下序,d就是…

《HelloGitHub》第 96 期

兴趣是最好的老师,HelloGitHub 让你对编程感兴趣! 简介 HelloGitHub 分享 GitHub 上有趣、入门级的开源项目。 https://github.com/521xueweihan/HelloGitHub 这里有实战项目、入门教程、黑科技、开源书籍、大厂开源项目等,涵盖多种编程语言 …

Redis命令请求的执行过程(二)

命令请求执行的过程 命令执行器(2):执行预备操作。 服务器已经将执行命令所需的命令实现函数(保存在客户端状态的cmd属性)、参数(保存在客户端状态的argv属性)、参数个数(保存在客户端状态的argc属性)都收集器了,但是在真正执行命令之前,程序还需要进行…

spring多线程实现+合理设置最大线程数和核心线程数

1.最简单的方法: 需要在 Spring Boot 主类上添加 EnableAsync 注解启用异步功能;需要在异步方法上添加 Async 注解。 示例代码如下: SpringBootApplication EnableAsync public class Application {public static void main(String[] args…

vue3+threejs新手从零开发卡牌游戏(十九):添加战斗事件

接上一节实现画线后,现在可以根据鼠标移动位置判断是否选中了对方区域怪兽卡牌: 修改game/index.vue代码,在画线方法中添加获取目标对象方法: const selectedCard ref() // 选中的场上card const selectedTargetCard ref() // …

[实验报告]--基于端口安全

[实验报告] 目录 [实验报告] 一、项目背景 二、实验环境 三、项目规划设计 四、项目实施 五、验证项目成果 基于端口安全的 Jan16 公司网络组建 一、项目背景 Jan16 公司开发部为重要部门,所有员工使用指定的计算机工作,为防止员工或访客使 用个…

手机有线投屏到直播姬pc端教程

1 打开哔哩哔哩直播姬客户端并登录(按下图进行操作) 2 手机用usb数据线连接电脑(若跳出安装驱动的弹窗点击确定或允许),usb的连接方式为仅充电(手机差异要求为仅充电),不同品牌手机要求可能不一样,根据实际的来 3 在投屏过程中不要更改usb的连接方式(不然电脑会死机需要重启) …

PostgreSql 01 安装,创建用户,创建数据库,创建关系

01.安装postgresql postgreSql 是在linux上 去官网找按照的方式 选择好postgreSql 的版本,已经Linux的发行版本 拿到命令,直接扔到Linux中运行即可 # 下载PGSQL的rpm包 sudo yum install -y https://download.postgresql.org/pub/repos/yum/reporpm…

【微众银行笔试题汇总】 2024-03-31-微众银行春招笔试题-三语言题解(CPP/Python/Java)

🍭 大家好这里是KK爱Coding ,一枚热爱算法的程序员 ✨ 本系列打算持续跟新微众银行近期的春秋招笔试题汇总~ 💻 ACM银牌🥈| 多次AK大厂笔试 | 编程一对一辅导 👏 感谢大家的订阅➕ 和 喜欢&…

Python学习:面相对象

面向对象 面向对象技术简介 类(Class): 用来描述具有相同的属性和方法的对象的集合。它定义了该集合中每个对象所共有的属性和方法。对象是类的实例。方法:类中定义的函数。类变量:类变量在整个实例化的对象中是公用的。类变量定义在类中且在函数体之外。类变量通常不作为实…

微信小程序开发学习笔记——4.6tabBar底部tab栏配置用法

>>跟着b站up主“咸虾米_”学习微信小程序开发中,把学习记录存到这方便后续查找。 一、tabBar https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#tabBar 二、icon下载 https://www.iconfont.cn/collections/index?spma…

电脑端手机配置检测的安全性和隐私保护探讨

摘要 本文介绍了如何使用克魔助手工具在电脑上检测手机的配置信息。通过该工具,用户可以全面了解手机的硬件和操作系统信息,包括电池、CPU、内存、基带信息和销售信息等。 引言 在日常工作中,了解手机的配置信息对于开发和测试人员非常重要…

具备实时数据更新能力的大语言模型——Larimar

ChatGPT、Claude.ai等大模型产品就像“图书馆”一样为我们生成各种各样的内容。但是想更新这个图书馆里的知识却不太方便,经常需要漫长、费时的预训练、蒸馏才能完成。 研究人员提出了一种具有情景记忆控制的大语言模型Larimar,这是一种类似人脑"海…

Splunk Attack Range:一款针对Splunk安全的模拟测试环境创建工具

关于Splunk Attack Range Splunk Attack Range是一款针对Splunk安全的模拟测试环境创建工具,该工具完全开源,目前由Splunk威胁研究团队负责维护。 该工具能够帮助广大研究人员构建模拟攻击测试所用的本地或云端环境,并将数据转发至Splunk实例…

【一种基于改进A*算法和CSA-APF算法的混合路径规划方法】—— 论文阅读

论文题目:A Hybrid Path Planning Method Based on Improved A∗ and CSA-APF Algorithms 1 摘要 大问题:复杂动态环境下全局路径规划难以避开动态障碍物,且局部路径容易陷入局部最优的问题 问题1:针对A*算法产生冗余路径节点和…

【java9】java9新特性之多版本共存JAR

多版本共存的JAR(Java Archive)文件是Java 9引入的一个新特性,它允许在同一个JAR文件中维护和使用不同版本的Java类或资源。这种特性使得开发者能够创建一个JAR包,该包可以在多个Java版本上运行,而无需为每个Java版本提…