Debug-011-ES6中的链判断运算符(?.)

这个问题的来源是:

        前端在请求后端接口,拿到的数据,有可能是这样的:

data:{a:{b:{c:{d:""}}}
}

我们前端小伙伴联调时需要取到d的值,我以前是这样写的:

// 错误的写法
const value= data.a.b.c.d   || '给个默认值'

上面明显是一个错误写法,因为有时候接口返回的数据data中是没有a的,data有可能是{} 或者null ,这个时候再这样取值肯定会报错。就像下面的例子一样:

大家肯定不会像我一样踩过这个坑吧。

以前链判断没有出现之前有这样一种写法:


// 正确的写法
const value= (data && data.a  && data.a.b && data.a.b.c && data.a.b.c.d) || '给个默认值'

这样写其实就是判断data是否有值,如果有就继续判断data.a是否有值,如果没有就会使用“给个默认值”,有就继续往下找,以此类推。

显然这样写非常麻烦,代码过于臃肿了。

因此引出链判断运算符            ?. 

//简化写法
const value= data?.a?.b?.c?.d   || '给个默认值'

?.运算符,直接在链式调用的时候判断,左侧的对象是否为null或者undefined,如果是的,就不再往下运算,而是返回undefined

---------------------------------------------------补充---------------------------------------------------

Null 判断运算符(??)

  1. || 属性的值为null、undefined、为空字符串、false、0,默认值就会是 || 右边的值
  2. ?? 只有运算符左侧的值为null或undefined时,才会返回右侧的值
  3. ??  ||  && 三者谁的优先级更高,现在的要求是必须添加小括号包裹,不然会报错,下面是我在控制台上面的打印。

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

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

相关文章

ACM Proceedings Template 使用方法

模板导入 打开ACM Primary Article Template官网,可以看到自带overleaf模板,接下来我们使用overleaf来自动导入模板。 选择你需要的ACM Conference or Journals模板,然后Open as Template 栏目说明 接下来依次解释一下左边栏目的作用 …

5月28号总结

刷题记录 1.A. Phone Desktop 输入: 11 1 1 7 2 12 4 0 3 1 0 8 1 0 0 2 0 15 0 8 2 0 9 输出: 1 1 2 2 1 1 0 1 1 2 5 题意:题目给我们1x1和2x2的图标个数,让我们求最少需要多少个5x3的屏幕。 思路:当只看2x2的图…

开源与闭源:AI大模型发展路径的博弈

一、引言 在人工智能(AI)领域,大模型以其卓越的性能和广泛的应用前景,成为了近年来技术发展的热点。然而,在大模型的发展路径上,开源与闭源两种模式一直存在着激烈的博弈。本文将深入探讨这两种模式在大模…

module ‘plotting‘ has no attribute ‘EpisodeStats‘

plotting.py 的版本不同,可以使用下列版本 reinforcement-learning/lib/plotting.py at master dennybritz/reinforcement-learning GitHubImplementation of Reinforcement Learning Algorithms. Python, OpenAI Gym, Tensorflow. Exercises and Solutions to a…

如何将云服务器上操作系统由centos切换为ubuntu

本文将介绍如何将我们购买的云服务器上之前装的centos切换为ubuntu,云服务器以华为云为例,要切换的ubuntu版本为ubuntu20.04。 参考官方文档:切换操作系统_弹性云服务器 ECS (huaweicloud.com) 首先打开华为云官网,登录后点击右…

MongoDB分片集群容灾方案

MongoDB分片集群容灾方案 1. 集群同步工具介绍1.1 第三方数据同步工具mongoshake1.2 官方同步工具mongosync 2. 工具对比2.1 数据一致性2.2 稳定性和可靠性2.3 维护成本 3. 总结 1. 集群同步工具介绍 最近客户咨询MongoDB分片集群市面上主流的容灾方案,所以抽空整理…

安卓六种页面加载优化方案对比总结

根据工作经验,笔者提炼了六种页面加载优化方式,按照业务与非业务,将六种加载方式分为两类: 业务类 控制业务与UI的执行顺序、控制多业务之间的执行顺序 ①预加载:是指在进入页面之前,提前获得页面所需得数据…

直播预告|中服云第5代`工业物联产品线上发布会

我国作为全球制造业的领军者,拥有世界上最完整且健全的制造业产业链。但随着各企业规模的扩大和设备的增加,企业设备管理面临的难点和挑战也越来越多。 为了满足企业不断提高的设备管理需求,中服云即将推出全新的“设备全生命周期管理系统5.…

机器学习之聚类学习

聚类算法 概念 根据样本之间相似性,将样本划分到不同类别种,不同相似度计算方法,会得到不同聚类结果,常用相似度计算方法为:欧氏距离 目的是在没有先验知识情况下,自动发现数据集种内在结构和模式 无监督…

告别裸奔,聊聊主流消息队列的认证和鉴权!

大家好,我是君哥。 我们在使用消息队列时,经常关注的是消息队列收发消息的功能。但好多时候需要对客户端有一定的限制,比如只有持有令牌的客户端才能访问集权,不允许 Producer 发送消息到某一个 Topic,或者某一个 Top…

人脸识别——Webface-OCC遮挡人脸识别算法解析

1. 概述 自2019年被誉为人脸识别技术的元年,各地纷纷引入这项技术。然而,自2020年起,为了抵御冠状病毒(COVID-19)的全球传播,人们普遍开始佩戴口罩。众所周知,现有人脸识别模型在面对遮挡物&am…

Dalle2学习

Dalle2 mini有GitHub库并且有网页可以直接测试

网络之再谈体系结构

大家都知道的是网络的体系结构,现代软件常用的体系结构无非是TCP/IP协议栈,OSI因为实现复杂并且效率没有TCP/IP协议栈好,所以不用OSI,但是,最近在复习网络知识的时候,发现了一些奇怪的地方,那就…

C/C++连接MySQL

本章Gitee仓库地址:mysql连接基本操作 文章目录 1. mysql connect库2. mysql相关接口2.1 mysql_init()2.2 mysql_real_connect()2.3 mysql_query()2.4 mysql_store_result()2.41 mysql_num_rows2.42 mysql_num_fields2.43 mysql_fetch_row2.44 mysql_fetch_fields 2…

中国上市企业行业异质性数据分析

数据简介:企业行业异质性数据是指不同行业的企业在运营、管理、财务等方面的差异性数据。这些数据可以反映不同行业企业的特点、优势和劣势,以及行业间的异质性对企业经营和投资的影响。通过对企业行业异质性数据的分析,投资者可以更好地了解…

STM32系列-STM32介绍

🌈个人主页:羽晨同学 💫个人格言:“成为自己未来的主人~” STM32介绍 STM32介绍 ST:指的是意法半导体 M:指定微处理器 32:表示计算机处理器位数 ARM分成三个系列: Cortex-A&#xff1…

Python读取Excel表格文件并绘制多列数据的曲线图

本文介绍基于Python语言,读取Excel表格数据,并基于给定的行数范围内的指定列数据,绘制多条曲线图,并动态调整图片长度的方法。 首先,我们来明确一下本文的需求。现有一个.csv格式的Excel表格文件,其第一列为…

Sqoop的安装与测试

这里写目录标题 什么是Sqoop?Sqoop的安装与配置安装测试 什么是Sqoop? Sqoop就是hadoop和mysql的一个中间介质 , 作用就是可以将hadoop中的数据传到mysql中 , 或将mysql中的数据导入到hadoop中 Sqoop的安装与配置 安装 详细代码 //解压安装 [roothadoop soft]# tar -zxv…

【漏洞复现】用友NC registerServlet JNDI 远程代码执行漏洞(XVE-2024-10248)

0x01 产品简介 用友NC是 用友软件股份有限公司开发的一套企业级管理软件系统。它是一个基于互联网的多层应用系统,旨在为中大型企业提供全面、集成的管理解决方案。是一种商业级的企业资源规划云平台,为企业提供全面的管理解决方案,包括财务…

SwiftUI中EnvironmentObject的使用(多界面共享数据)

SwiftUI的EnvironmentObject是一个强大的工具,它允许你在多个视图之间共享数据(使用一个可观察对象)。当你有一个复杂的视图层次结构,并且需要在没有直接连接的视图之间共享相同的可观察对象时,它特别有用。 我们之前传递数据主要是通过init…