JS中新逻辑赋值运算符使用(?.、? ?、| |=、=)
前言：可选链操作符、空值合并操作符(??)， AND（&&）和 OR（||）运算符等的使用让我们的代码更干净简洁。在此之前必须先了解falsy 值、 nullish 值这两个概念。
- falsy 值（虚值）：是在布尔值Boolean上下文中认定为 false 的值。在 JavaScript 中只有 8 个 falsy 值，包括undefined、null、false、空字符串 (双引号 ""、单引号’’、反引号 ``)、NaN、0。
- nullish 值：要么是 null 要么是 undefined 。nullish 值总是 falsy 。
一、可选链操作符( ?. )：允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。
简单来说，可以把?. 中的这个？看成是是否存在该属性，然后再链式调用。如果?前面的值为nullish值（null或者undefined）则直接返回undefined，不会再往下执行链式调用。看代码理解：
let res = {
say: "lemon say",
data: {
age: 18,
name: "lemon",
sex: "woman"
}
};
// 判断是否存在name属性并赋值
if (res && res.data && res.data.name) {
this.title = res.data.name
}
// 改成使用?.方法，如果?前面的res或者是data为nullish值（null或者undefined）则直接返回undefined，不会再往下执行链式调用
this.title = res?.data?.name // lemon
this.sex = res?.result?.sex // undefined二、空值合并操作符(??)：当左侧的操作数为nullish值（null或者undefined），返回其右侧操作数，否则返回左侧操作数。
听起来好像和或运算符（||）没啥区别，实际上是有区别的。空值合并操作符（??）是根据nullish值来判断，而或运算符（||）是根据falsy 值来判断。
let count = 0;
let name = "";
// 或运算符（||）
let num = count || 666;
let str = name || "lemon";
console.log(num); // 666
console.log(str); // lemon
// 空值合并操作符（??）只要左边不是null或者undefined就返回左边
let num = count ?? 666;
let str = name ?? "lemon";
console.log(num); // 0
console.log(str); // ""1.逻辑空分配（?? =）：x ??= y
逻辑空值运算符左到右操作，仅在x为nullish值（null或者undefined）时才将值分配x，x如果不是nullish值时压根就不会执行y了，更不存在赋值操作一说。如果y是一个函数，它也不会被调用。
let count = 3;
let name = null;
count ??= 666;
name ??= "lemon";
console.log(count); // 3
console.log(name); // lemon2.空运算符与空值合并操作符（??）同时使用：
let res = {
say: "lemon",
data: {
age: 18,
name: "lemon" // data 的 sex 属性未有定义
}
};
// 当 res?.data?.sex的值为nullish值时，则将woman赋值给sex
let sex = res?.data?.sex ?? 'woman'
console.log(sex) // woman 3. 空值合并操作符（??）不能直接与 AND（&&）和 OR（||）操作符组合使用。
null || undefined ?? "lemon"; // 抛出 SyntaxError
true || undefined ?? "lemon"; // 抛出 SyntaxError三、逻辑或分配（||=）：x ||= y
仅在左侧表达式为 falsy 值（虚值） 时才赋值。就是或运算符（||）与赋值运算符同时使用。
四、逻辑与分配（&& =）：x &&= y
逻辑赋值运算符仅在左侧为真时才赋值。就是逻辑与 (&&)与赋值运算符同时使用。