JavaScript 中(?.)、(?.?)、(?.?=) 的用法

可选链运算符：?.

如果一个值为null、或者是undefined

let a;
let b;
if(!!a){
	b = a.name;
}else{
	b = undefined;
}

?.就和if else的例子是一个意思，只有当a存在，同时a具有name属性的时候，才会把值赋给b，否则就会将undefined赋值给b.重要的是，不管a存在与否，这么做都不会报错

let a;
let b = a?.name;

当然我们还可以这么干

let a;
let b;
b = a?.name?.age?.type?.xxx; // 不报错
a?.b?.xxx; // 不报错

不论有多少属性，只要有最后可以访问到属性，访问到最终的结果，就会赋值给b，否则，就把undefined赋值给b

也可以结合空值合并运算符 ，设置默认返回值

let a;
let b;
b = a?.name?.xxx ?? '没找到';
console.log('b ===>', b) // b ===> 没找到

可选链与函数调用

调用一个可能不存在的方法时，如果被调用的方法不存在，使用可选链可以使表达式自动返回undefined而不是抛出一个异常

let a = b.c?.();

注意: 如果存在一个属性名且不是函数，使用?.仍然会产生一个TypeError异常b.c is not a function

注意: 如果b自身是null或者undefined，异常TypeError仍会被抛出b is null如果你希望允许b也为null或者 undefined，那么你需要像这样写b?.c?.()

空值合并运算符：??

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

console.log(1 ?? "xx")			//1
console.log(0 ?? "xx") 			//0
console.log(-1 ?? "xx") 		//-1
console.log("" ?? "xx") 		//''
console.log(null ?? "xx") 		//xx
console.log(undefined ?? "xx")  //xx 

空赋值运算符：??=

逻辑空赋值运算符 x ??= y仅在左侧操作数是null或undefined时对其赋值

let a = 0;
console.log('a ===>', a ??= 0) // a ===> 0