如何理解JavaScript的双问号运算符？空值合并运算符

我们相信：世界是美好的，你是我也是。 来玩一下解压小游戏吧！

本文普及一下一个JavaScript的最新特性：双问号运算符，或者称为空值合并运算符。当然，这个是最新的ES2020里面的特性，最新的nodejs和chrome浏览器，都是支持这个空值合并双问号运算的。

苏南大叔的“程序如此灵动”技术博客，记录苏南大叔的编程所学所想。本文测试环境：win10，chrome@116.0.5845.141，node@16.14.2。需求其实也非常简单：当一个变量是null或者undefined的时候，给它赋值一个合适的默认值。

双问号运算、 空值运算符

JavaScript双问号运算符，也称为空值合并运算符。它是 ES2020 的一个新特性，这个运算符会在左侧表达式是null或undefined时返回右侧的表达式。

a = b??c

相当于：

a = isNull(b) ? c : b ;

测试代码：

a = null ?? "a";
b = undefined ?? "b";
c = "" ?? "c";
d = 0 ?? "d";
e = false ?? "e";
console.log(a, b, c, d, e);

输出：

a b  0 false

从运算结果上看，使用了空值合并运算符，只把null和undefined替换为一个预定义的值。对于空字符串和0、false都并不会做任何修改。

运算优先级

出于安全考虑，双问号配合 逻辑或（||）和逻辑与（&&）时，需要使用到小括号。目的是明确其优先级。测试代码：

s = "su";
n = "nan";
sn1 = (s || n) ?? "sn1";
sn2 = (s && n) ?? "sn2";
console.log("sn1", sn1, (s || n) == s);
console.log("sn2", sn2, (s && n) == n);
// sn3 = s || n ?? "sn3";   // '||' and '??' operations cannot be mixed without parentheses.

输出：

sn1 su true
sn2 nan true

不使用小括号的时候，可能会得到错误提示如下：

 '||' and '??' operations cannot be mixed without parentheses.

结束语

本文讲述的是js的双问号运算符，也称空值合并运算符。更多苏南大叔的node经验文章，请点击：

• https://newsn.net/tag/node/

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。