js 中的逻辑赋值运算

逻辑运算符

在 js 中，我们都知道有逻辑运算符，比如 逻辑与 （ && ）、逻辑或（ || ）、逻辑非（ ! ）、空值合并运算符（??）

逻辑与 （ && ）

当且仅当所有操作数为 true 时，一组布尔操作数的逻辑与（&&，逻辑连接）运算结果为 true，否则为 false。

一般来说，当从左到右求值时，该操作符返回第一个假值操作数的值；如果它们都是真值，则返回最后一个操作数的值。

const a = 3;
const b = -2;

console.log(a > 0 && b > 0);
// Expected output: false

逻辑或（ || ）

对于一组操作数的逻辑或（||，逻辑析取）运算符，当且仅当其一个或多个操作数为真，其运算结果为真。它通常与布尔（逻辑）值一起使用。当它是布尔值时，返回一个布尔值。然而，|| 运算符实际上是返回一个指定的操作数的值，所以如果这个运算符被用于非布尔值，它将返回一个非布尔值。

const a = 3;
const b = -2;

console.log(a > 0 || b > 0);
// Expected output: true

 

空值合并运算符（??）

空值合并运算符（??）是一个逻辑运算符，当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数。与逻辑或运算符（||）不同，逻辑或运算符会在左侧操作数为假值时返回右侧操作数。也就是说，如果使用 || 来为某些变量设置默认值，可能会遇到意料之外的行为。比如为假值（例如，'' 或 0）时。对于仅想排除 null 和 undefined的情况，用两个问号，对于所有假植的判断情况，用 ||  或。

let age = 0, address = "", isEating = false;
let ageValue = age || 20;
let addressValue = address || "上海";
let isEatingValue = isEating || true;
console.log(ageValue); // 20
console.log(addressValue); // "上海"
console.log(isEatingValue); // true

逻辑赋值

就是在逻辑运算符的情况下+赋值比如  a&&=2，就是  a=a&&2

逻辑空赋值（??=）

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

const a = { duration: 50 };

a.duration ??= 10;
console.log(a.duration);
// Expected output: 50
// =>
// a.duration = a.duration ?? 10

a.speed ??= 25;
console.log(a.speed);
// Expected output: 25
// =>
// a.speed = a.speed ?? 25

逻辑与赋值（&&=）

逻辑与赋值（x &&= y）运算仅在 x 为真值时为其赋值。

let a = 1;
let b = 0;

a &&= 2;
console.log(a);
// Expected output: 2
// =>
// a = a && 2;

b &&= 2;
console.log(b);
// Expected output: 0
// =>
// b = b && 2
// 按照逻辑与规则进行赋值运算

 

注意：逻辑运算符除了逻辑非是（  ! ） ，其他都是两个连续相等的运算符表示，单个运算符表示的都是按位运算符，不要搞混。

如：按位与（ & ）、按位或（ | ）、按位非（ ~ ）、按位异或（ ^ ）、按位与赋值（ &= ）、按位或赋值（ |= ）、按位异或赋值（ ^=）

具体参考 MDN 文档