空值合并运算符 (??) 是一个逻辑运算符,仅当左侧(第一个参数)为空或未定义时才返回运算符(第二个参数)的右侧。 在所有其他情况下,它返回第一个参数。

下列这两行测试代码,分别输出 Hello 和 132

因此,正如您在上面的示例中看到的那样,返回 Hello 是因为 undefined 位于运算符的左侧。 如果 null 代替 undefined,结果将是相同的。 在第二个示例中,如果第一个参数中存在除 null 或 undefined 以外的任何内容,则操作员不会检查第二个参数,而是会立即打印第一个值。

在空值合并操作符被加入 ECMAScript 2020 之前,每当我们想为变量赋予默认值时,我们使用 OR (||) 逻辑运算符。 但是使用 OR 运算符有一些潜在的问题: || 运算符并不区分 false、0、“” 和 null/undefined。 所有这些都被 OR 运算符判定为返回 false,所以如果它遇到任何这些作为第一个参数,那么我们将得到第二个参数作为结果,这使得 OR 运算符的可信度降低。

下图显示了 ?? 和 || 这两个操作符的差异:

遇到 0,|| 会返回右边的操作数 100,而因为 0 既不是 undefined 也不是 null,因而 0 ?? 100 会返回 0.

关于 ?? 的优先级问题

?? 运算符仅比 MDN 文档中给出的优先级表中的 OR 运算符低一位。 这意味着它将在 = 和三元运算符之前以及 + 和 * 等运算符之后进行评估。

为了提高代码可读性,在使用 ?? 时请添加小括号:

SAP Spartacus 的实现中也有大量 ?? 的用法,如下图所示:

更多Jerry的原创文章,尽在:“汪子熙”:

谈谈 JavaScript 中的空值合并操作符 Nullish coalescing operator相关推荐

  1. JavaScript使用 nullish coalescing operator(空值合并操作符??)导致部分Android手机打不开H5页面的解决方法

    目录 前言 空值合并操作符?? 解决方法 方法一 方法二 如何判断浏览器是否支持ES某一特性 支持

  2. 也谈谈Javascript中的几个怪异特性(上)

    2019独角兽企业重金招聘Python工程师标准>>> Andy Croxall在Ten Oddities And Secrets About JavaScript罗列了他认为的10 ...

  3. this调用语句必须是构造函数中的第一个可执行语句_谈谈JavaScript中的函数构造式和new关键字...

    您是否曾困惑于 Javascript 中的new关键字呢?是否曾想理解关于 function 和 constructor 的区别是什么呢? 大多数 Javascript 的新开发者不太想要使用new关 ...

  4. 谈谈JavaScript中的function constructor和new关键字

    您是否曾困惑于 Javascript 中的new关键字呢?是否曾想理解关于 function 和 constructor 的区别是什么呢? 大多数 Javascript 的新开发者不太想要使用new关 ...

  5. javascript 分号_让我们谈谈JavaScript中的分号

    javascript 分号 要使用它们,还是不使用它们- (To use them, or not to use them-) Semicolons in JavaScript divide the ...

  6. javascript 无法修改 数组中对象_谈谈JavaScript中对象建立(Object)

    在这篇文章中我将会着重说明如何创建JavaScript里的对象(Object). 对象(Object)是什么? 在开始介绍如何创建对象前,我们要知道对象是什么.对象(Object)简单地来说,就是一堆 ...

  7. 谈谈JavaScript中function多重理解

    JavaScript 中的 function 有多重意义.它可能是一个构造器(constructor),承担起对象模板的作用: 可能是对象的方法(method),负责向对象发送消息.还可能是函数,没错 ...

  8. 谈谈javascript中的多线程

    不存在的,javascript中根本不存在多线程...... 先不要慌,没有多线程我们可以模仿多线程呀!定时器.web workder等等. 存在即合理,为啥javascript需要多线程? java ...

  9. 谈谈JavaScript中常见的数据类型

    前言:学好一门语言,数据类型也是关键,掌握了数据类型,也就掌握了关键的一部分,接下来我们走进JavaScript的数据,来看看它的数据类型. 数据类型: 一.number 二.string 三.obj ...

最新文章

  1. 刻意练习:LeetCode实战 -- Task17. 最长回文子串
  2. 一种快速统计SQL Server每个表行数的方法
  3. 开发者盛宴!Apache HBasecon 峰会来北京了,速来免费报名
  4. 走进武汉,探索多媒体开发最佳实践
  5. Docker 精通之 docker-compose
  6. 猎聘 大街_大街开放时
  7. 研磨java_研磨设计模式.pdf
  8. 【JavaScript】去除空格
  9. 不同SIP客户端使用说明
  10. VS2015安装VBpowerpacks工具箱教程
  11. 数据分析报告4:睡眠情况分析
  12. autoCAD恐吓式销售_恐吓式软文的例子 恐吓式软文营销案例分享
  13. Codewars-Java编程刷题学习4-Jaden Casing Strings
  14. dhcp服务器是如何进行租约信息的更新的,DHCP服务器
  15. Matlab中产生门函数----Heaviside函数的调用方法
  16. 优酷路由器刷openwrt固件一
  17. 新一代容器技术———Podman
  18. php下载pdf文件不全,关于php:Zip PDF文件下载无效
  19. SQL优化 —— in与not in
  20. 总结kali中文输入法失败的原因

热门文章

  1. csv 20位数据 如何打开可以预览完整数字_干货Python Pandas 做数据分析之玩转 Excel 报表分析...
  2. 内置的进制转换的方法---小笔记
  3. vs2015+opencv+qt打包exe的问题
  4. 小程序跳转页面与传值
  5. flask框架中勾子函数的使用
  6. 如何HttpWebRequest模拟登陆,获取服务端返回Cookie以便登录请求后使用
  7. 云计算作为当前趋势 能带给你哪些好处?
  8. 胡凌:隐私的终结——大数据时代的个体生活危机
  9. 四中方式实现单例模式
  10. 浅谈PopupWindow弹出菜单