es6中的可选链操作符

1.可选操作符 ?.   js会在尝试访问 a.c 之前隐式的检查并确定 a 既不是null也不是undefined。如果 a 是null或者undefined,表达式将会短路计算直接返回undefined

let a;
const b = a.c; //报错

//之前的解决办法,返回undefined
const d = a && a.c;

//使用可选操作符，返回undefined
const f = a?.c

2.可选操作符 ??   空值合并操作符,可以在使用可选链时设置一个默认值,前值是null或者undefined返回后面的默认值

const a = 0 ?? '默认值a';
cosnt b = null ?? '默认值b';


console.log(a); // "0"  0是假值，但不是 null 或者 undefined
console.log(b); // "默认值b"


const c = b?.x ?? '默认值c';

console.log(a); // "默认值c"  两个可选链操作符的连用

3.变量赋默认值一般使用逻辑或操作符 || 。但是由于 || 是一个布尔逻辑运算符，左侧的操作数会被强制转换成布尔值用于求值。任何假值（0， ''， NaN， null， undefined）都不会被返回。这导致如果你使用0，''或NaN作为有效值，就会出现不可预料的后果。这也是 ?? 操作符可以解决这个问题


const a = 0；
const b = a || 5


//当0作为有效值，与我们期望的 b 的值不一致
console.log(b); // 5