双问号操作符和可选链操作符

Posted 秋水不寒

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了双问号操作符和可选链操作符相关的知识,希望对你有一定的参考价值。

双问号操作符??),也被称作空值合并运算符,当左侧的操作数为 null 或者 undefined 时,返回其右侧操作数,否则返回左侧操作数

const foo = null ?? 'default string';
console.log(foo); // "default string"

可能有人会问 ??  和 || 有什么区别呢?

?? 的左侧只判断两种情况:null 和 undefined,而 || 的左侧只要是假值(包括'' 和 0)都会返回右侧的值

const number = 0;
console.log(number || 100); // 100
console.log(number ?? 100); // 0

可选链操作符?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符,不同之处在于,在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误,该表达式短路返回值是 undefined。与函数调用一起使用时,如果给定的函数不存在,则返回 undefined

这等价于以下表达式,但实际上没有创建临时变量:

1

2

let temp = obj.first;

let nestedProp = ((temp === null || temp === undefined) ? undefined : temp.second);注意:可选链不能用于赋值

let object = ;
object?.property = 1; // Uncaught SyntaxError: Invalid left-hand side in assignment;

短路计算

当在表达式中使用可选链时,如果左操作数是 null 或 undefined,表达式将不会被计算,例如:

1

2

3

4

5

let potentiallyNullObj = null;

let x = 0;

let prop = potentiallyNullObj?.[x++];

console.log(x); // x 将不会被递增,依旧输出 0

以上是关于双问号操作符和可选链操作符的主要内容,如果未能解决你的问题,请参考以下文章

双问号操作符和可选链操作符

双问号操作符和可选链操作符

空值合并运算符和可选链

空值合并运算符和可选链

《从零开始学Swift》学习笔记(Day 26)——可选链

ES11中的globalThis和可选链