JavaScript 运算符，?.、??=、??

JavaScript中一些强大的操作符，合理应用可以提升我们日常编码效率、简化代码、提升代码质量。

可选链操作符

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

当尝试访问可能不存在的对象属性时，可选链操作符将会使表达式更短、更简明。在探索一个对象的内容时，如果不能确定哪些属性必定存在，可选链操作符也是很有帮助的。

const obj = {
  boo: 'Alice',
  bar: {
    name: 'Dinah'
  }
};
 
const a = obj.boo?.a;
console.log(a);
// expected output: undefined
 
const b = obj.temp?.a;
console.log(b);
// expected output: undefined
 
console.log(obj.nonFun?.());
// expected output: undefined

逻辑空赋值

逻辑空赋值运算符 (x ??= y) 仅在 x 是 nullish (null 或 undefined) 时对其赋值。

const obj = { a: 'a' };
 
obj.a ??= 'assign a';
console.log(obj.a);
// expected output: "a"
 
obj.b ??= 'assign b';
console.log(obj.b);
// expected output: "assign b"

空值合并运算符

空值合并操作符（??）是一个逻辑操作符，当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数。

与逻辑或操作符（||）不同，逻辑或操作符会在左侧操作数为假值时返回右侧操作数。也就是说，如果使用 || 来为某些变量设置默认值，可能会遇到意料之外的行为。比如为假值（例如，'' 或 0）时。

const foo = null ?? 'foooo';
console.log(foo);
// expected output: "foooo"
 
const bar = '' ?? 'barrrrrr';
console.log(bar);
// expected output: ""