掌握 ECMAScript 2021（ES12）中的逻辑赋值操作符-JavaScript中文网-JavaScript教程资源分享门户

在 ECMAScript 2021（ES12）中，新增了逻辑赋值操作符（Logical Assignment Operators），这些操作符可以简化代码，提高开发效率。本文将介绍逻辑赋值操作符的使用方法，并通过实例代码展示其指导意义。

逻辑赋值操作符

逻辑赋值操作符是将逻辑运算符（&&、||、??）和赋值操作符（=）结合起来的一种操作符。具体来说，逻辑赋值操作符包括以下三种：

这些操作符的作用是将逻辑运算的结果赋值给变量。

逻辑与赋值操作符（&&=）的作用是判断左侧的变量是否为真，如果为真，则将右侧的值赋给左侧的变量，否则不进行赋值操作。

示例代码：

let a = 5;
a &&= 10;
console.log(a); // 输出：10

let b = 0;
b &&= 10;
console.log(b); // 输出：0

在上面的代码中，变量 a 的值为真，因此将其赋值为 10；变量 b 的值为假，因此不进行赋值操作。

逻辑或赋值操作符（||=）的作用是判断左侧的变量是否为假，如果为假，则将右侧的值赋给左侧的变量，否则不进行赋值操作。

示例代码：

let a = 0;
a ||= 10;
console.log(a); // 输出：10

let b = "hello";
b ||= "world";
console.log(b); // 输出：hello

在上面的代码中，变量 a 的值为假，因此将其赋值为 10；变量 b 的值为真，因此不进行赋值操作。

空值合并赋值操作符（??=）的作用是判断左侧的变量是否为 null 或 undefined，如果为 null 或 undefined，则将右侧的值赋给左侧的变量，否则不进行赋值操作。

示例代码：

let a = null;
a ??= 10;
console.log(a); // 输出：10

let b = 5;
b ??= 10;
console.log(b); // 输出：5

在上面的代码中，变量 a 的值为 null，因此将其赋值为 10；变量 b 的值不为 null 或 undefined，因此不进行赋值操作。

逻辑赋值操作符的出现，可以简化代码，提高开发效率，同时也可以使代码更加清晰易读。使用逻辑赋值操作符可以让代码更加简洁，同时也可以减少代码中的重复部分。

在实际开发中，逻辑赋值操作符可以用于一些简单的逻辑判断，如判断变量是否为 null 或 undefined，或者判断变量是否为真或假等。

本文介绍了 ECMAScript 2021（ES12）中的逻辑赋值操作符，包括逻辑与赋值操作符、逻辑或赋值操作符和空值合并赋值操作符。通过实例代码展示了其使用方法和指导意义。逻辑赋值操作符的出现，可以简化代码，提高开发效率，同时也可以使代码更加清晰易读。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/67417faaed0ec550d720002c