链判断运算符 ?. 

业务场景:

 1 // 假设data是个数组,如果data没有值,为undefinded,则直接复制会报错,因为没有length这个属性
2
3 const dateCount = data.length // 报错
4
5 // 正常的处理情况是,加个判断
6 if (data) {
7 const dateCount = data.length
8 }
9
10
11 // 使用链判断符,就可一步到位
12 const dataCount = data?.length // data不存在时,直接返回undefined

上面代码使用了?.运算符,直接在链式调用的时候判断,左侧的对象是否为nullundefined。如果是的,就不再往下运算,而是返回undefined

这样好像没有链的感觉,再举个例子

1 const name = (data && data.person && data.person.name) || 'no name'
2 // 这样的判断机制非常麻烦
3
4 // 使用链判断符
5 const name = data?.Person?.Name || 'no name'
6 // 非常精简

注意点:

一、短路

a?.[++x]
// 等同于
a == null ? undefined : a[++x] // 假如为Ture,右侧永不执行

由于短路的机制,使用delete运算符时,如果为true,则无法执行。

二、括号影响

const name = (data?.person).name
// 不管data是否为空,.name一定会执行,所以不推荐使用链运算符的时候使用括号

三、右侧不能是十进制数值

这是为了兼容三元与运算符。a ? .3 : 0,如果按照?.作为链运算符的话,就会冲突到

四、禁止场合

1、禁止在构造函数(new)的时候使用

2、?.右侧有模板字符串``

3、?.左侧是super

4、?.用于赋值运算的左侧。(右侧可)

null 判断运算符??

业务场景:

设置变量默认值的时候,正常使用||进行赋值。

const name = data.name || 'tom'

原意是data,name为空,则使用tom这个默认值,但是如果data.name为false或者0, 默认值也会生效

1 const name = data.name ?? 'tom'

使用??来处理,则data.name必须是null或者undefined时,才会使用默认值

ES2020链判断运算符?.和Null判断运算符??的更多相关文章

  1. 链判断运算符和Null 判断运算符

    链判断运算符 如果我们要获取一个对象的深层嵌套属性,例如获取文章标题res.data.article.title,然后为了安全起见,我们肯定不能直接这样获取,万一res对象没有article属性了呢, ...

  2. php类型的相关函数,运算符,条件判断,循环

    类型的相关函数 函数的原型  :函数返回值类型 函数名(参数1类型 参数1,参数2类型 参数2--) 1, 任何一个函数,都要考虑它是否有返回值以及该返回值的类型,如果该函数没有返回值,就用void来 ...

  3. 前端笔记知识点整合之JavaScript(二)关于运算符&初识条件判断语句

    运算符 数学运算符的正统,number和number的数学运算,结果是number.出于面试的考虑,有一些奇奇怪怪的数学运算: 数学运算中:只有纯字符串.布尔值.null能够进行隐式转换.   //隐 ...

  4. 前端笔记之JavaScript(二)关于运算符&初识条件判断语句

    运算符 数学运算符的正统,number和number的数学运算,结果是number.出于面试的考虑,有一些奇奇怪怪的数学运算: 数学运算中:只有纯字符串.布尔值.null能够进行隐式转换. //隐式转 ...

  5. [19/09/16-星期一] Python的运算符和条件判断语句

    一.运算符 (1)算术运算符  + 加法运算符(如果是两个字符串之间进行加法运算,则会进行拼串操作) a = 10 + 5  计算 a = 'hello' + ' ' + 'world' 拼串  - ...

  6. 写给.NET开发者的Python教程(三):运算符、条件判断和循环语句

    本节会介绍Python中运算符的用法,以及条件判断和循环语句的使用方法. 运算符 运算符包括算术运算符.赋值运算符.比较运算符.逻辑运算符等内容,大部分用法和C#基本一致,下面我们来看一下: 算数运算 ...

  7. PHP NULL 合并运算符

    HP 7 新增加的 NULL 合并运算符(??)是用于执行isset()检测的三元运算的快捷方式. NULL 合并运算符会判断变量是否存在且值不为NULL,如果是,它就会返回自身的值,否则返回它的第二 ...

  8. 【前端】javascript判断undefined、null、NaN;字符串包含等

    JS中判断null.undefined与NaN的方法 这篇文章主要介绍了JS中判断null.undefined与NaN的方法,需要的朋友可以参考下 . . 写了个 str ="s" ...

  9. es6 Null 传导运算符

    Null 传导运算符 程实务中,如果读取对象内部的某个属性,往往需要判断一下该对象是否存在.比如,要读取message.body.user.firstName,安全的写法是写成下面这样. const ...

随机推荐

  1. 关于bat脚本中的命令状态码相关的%errorlevel%变量

    bat脚本中常用%errorlevel%表达上一条命令的返回值,即命令执行状态码.也称命令退出码 一般上一条命令的执行结果返回的值只有两种,0和非0 (如常见的1,2,4,5,9009等等),0一般会 ...

  2. Oracle学习(七)游标

    一.简介 定义 实质上是数据集,类似数组一样,把查询的数据集存储在内存当中. 使用时可以通过游标指向其中一条记录,也可以通过循环游标达到循环数据集的目的. 游标的种类 显式游标: 使用之前必须得先声明 ...

  3. 深入理解HBase

    深入理解HBase: https://www.jianshu.com/p/b23800d9b227

  4. CCNP七层参考模型

    一.OSI七层参考模型 七层参考模型由ISO组织提出,为什么是参考模型呢?因为我们现在实际应用的是TCP/IP协议栈,OSI模型仅供学习参考,下面具体说一下有哪七层: (7)应用层:应用程序和服务功能 ...

  5. 微服务实战系列(五)-注册中心Eureka与nacos区别

    1. 场景描述 nacos最近用的比较多,介绍下nacos及部署吧,刚看了下以前写过类似的,不过没写如何部署及与eureka区别,只展示了效果,补补吧. 2.解决方案 2.1 nacos与eureka ...

  6. 消息队列之事务消息,RocketMQ 和 Kafka 是如何做的?

    每个时代,都不会亏待会学习的人. 大家好,我是 yes. 今天我们来谈一谈消息队列的事务消息,一说起事务相信大家都不陌生,脑海里蹦出来的就是 ACID. 通常我们理解的事务就是为了一些更新操作要么都成 ...

  7. Python-变量、变量作用域、垃圾回收机制原理-global nonlocal

    变量实现原理决定了Python使用的垃圾回收机制为变量引用计数,当这个对象引用计数为0时候,则会自动执行__del__函数回收资源, del方法只是把变量指向的对象引用计数减一而已并删除这个变量 表达 ...

  8. 普利姆算法(prim)

    普利姆算法(prim)求最小生成树(MST)过程详解 (原网址) 1 2 3 4 5 6 7 分步阅读 生活中最小生成树的应用十分广泛,比如:要连通n个城市需要n-1条边线路,那么怎么样建设才能使工程 ...

  9. 如何确定芯片pin1的位置

    来源:https://www.raviyp.com/embedded/150-identifying-pin-no-1-on-an-ic Identifying pin no 1 on an IC R ...

  10. [源码阅读] 阿里SOFA服务注册中心MetaServer(1)

    [源码阅读] 阿里SOFA服务注册中心MetaServer(1) 目录 [源码阅读] 阿里SOFA服务注册中心MetaServer(1) 0x00 摘要 0x01 服务注册中心 1.1 服务注册中心简 ...