es6 Null 传导运算符

Null 传导运算符

编程实务中，如果读取对象内部的某个属性，往往需要判断一下该对象是否存在。比如，要读取message.body.user.firstName，安全的写法是写成下面这样。

const firstName = (message
&& message.body
&& message.body.user
&& message.body.user.firstName) || 'default';

这样的层层判断非常麻烦，因此现在有一个提案，引入了“Null 传导运算符”（null propagation operator）?.，简化上面的写法。

const firstName = message?.body?.user?.firstName || 'default';

上面代码有三个?.运算符，只要其中一个返回null或undefined，就不再往下运算，而是返回undefined。

“Null 传导运算符”有四种用法。

obj?.prop// 读取对象属性
obj?.[expr]// 同上
func?.(...args)// 函数或对象方法的调用
new C?.(...args)// 构造函数的调用

传导运算符之所以写成obj?.prop，而不是obj?prop，是为了方便编译器能够区分三元运算符?:（比如obj?prop:123）。

下面是更多的例子。

// 如果 a 是 null 或 undefined, 返回 undefined
// 否则返回 a.b.c().d
a?.b.c().d
// 如果 a 是 null 或 undefined，下面的语句不产生任何效果
// 否则执行 a.b = 42
a?.b = 42
// 如果 a 是 null 或 undefined，下面的语句不产生任何效果
delete a?.b

es6 Null 传导运算符相关推荐

ES6的扩展运算符 [...arr]
ES6的扩展运算符可以说是非常使用的,在给多参数函数传参,替代Apply,合并数组,和解构配合进行赋值方面提供了很好的便利性. 数组去重 var arr = [1,2,3,4,5,2,3,1]; va ...
PHP NULL 合并运算符
PHP7 null合并运算符告别isset() 以前的写法 $info = isset($_GET['email']) ? $_GET['email'] : 'noemail'; 现在直接这样写就可 ...
php 三元运算符为空,PHP中三元运算符和Null合并运算符的简单比较
在PHP中,三元运算符(?:)和Null合并运算符(??)的用法相似,那么它们之间有什么差异?下面本篇文章就来带大家了解一下三元运算符和Null合并运算符,希望对大家有所帮助. 三元运算符三元运算符 ...
C# 中的 null 包容运算符 “!” —— 概念、由来、用法和注意事项
在 2020 年的最后一天,博客园发起了一个开源项目:基于 .NET 的博客引擎 fluss,我抽空把源码下载下来看了下,发现在属性的定义中,有很多地方都用到了 null!,如下图所示: 这是什么用法 ...
es6 三点运算符_基于es6三点运算符的使用方法(实例讲解)
先看一个es6规范下三点运算符的使用实例: let fun=function(a,...list){ console.log(a,list); }; fun('0','a','b','c');//0 ...
JS-ES2020链判断运算符（？.）和Null判断运算符（？？）
ES2020引入"链判断运算符"(?.) const firstName = message?.body?.user?.firstName || 'default'; const ...
ES6：拓展运算符、迭代器、数组、对象方法、模块化（重点）
目录 1. 拓展运算符 1.1 拓展运算符介绍 1.2 应用 2. Symbol 数据类型 2.1 介绍和创建 2.2 使用 2.3 symbol 内置属性 Symbol.search 3. 迭代器 ...
【ES6】...扩展运算符
文章目录扩展运算符一.在函数中使用 1.1 传递实参 1.2 接收形参 1.3 new 表达式二.在数组中使用 2.1 合并数组 2.2 拷贝数组三.在对象中使用 3.1 合并对象 3.2 拷 ...
ES6 的扩展运算符
扩展语法 1. 函数 rest 参数 ES6 引入 rest 参数也叫剩余参数,用于获取函数的多余参数,可以替代使用arguments对象 ... 出现在函数参数列表的最后,那么它就是 rest 参数 ...

es6 Null 传导运算符

Null 传导运算符

es6 Null 传导运算符相关推荐

最新文章

热门文章