前端开发中变量赋值是最常见的操作之一。在 JavaScript 中，我们可以使用运算符 "=" 来进行变量赋值。然而，当我们需要对变量进行特定的赋值操作时，我们可能需要使用其他运算符。
ES12 中的 Logical Assignment 就是一种非常有用的赋值操作方法。通过使用 Logical Assignment 运算符，我们可以更加简洁明了地对变量进行赋值操作，而不需要使用一系列的 if/else 语句来完成相应的操作。
Logical Assignment 是什么？
Logical Assignment 运算符是 ES12 中新增的一系列运算符。它们的作用是将指定的变量与某个表达式进行运算，并将运算结果赋值给指定的变量。在 JavaScript 中，一共有三种 Logical Assignment 运算符：
||=&&=??=
它们的作用分别是：
- 如果左侧的变量值为 false，将右侧的值赋给它
- 如果左侧的变量值为 true，将右侧的值赋给它
- 如果左侧的变量值为 null 或 undefined，将右侧的值赋给它
Logical Assignment 的优势
通过使用 Logical Assignment 运算符，我们可以完成更加简洁明了的赋值操作。假设我们需要将一个变量的值设置为一个 Boolean 类型的值，同时也需要保证这个变量的类型仍然是 Boolean 类型。在以前的版本中，我们需要编写如下代码：
let boolValue = false;
if(someCondition) {
boolValue = true;
}然而，通过使用 Logical Assignment 运算符，我们可以更加简洁地完成相应的赋值操作：
let boolValue = false; boolValue ||= someCondition;
在这个例子中，Logical Assignment 运算符减少了额外的 if/else 语句，让代码更加简洁易懂。
使用示例
我们来看一个具体的示例，使用 Logical Assignment 运算符将一个变量赋值为一个对象。代码如下：
-- -------------------- ---- -------
--- --- - ---
-- --- ----
-------- -
--- - ---
-
-- --- ----
--- --- ---在这个例子中，我们首先声明一个空对象 obj，然后使用 Logical Assignment 运算符对 obj 进行赋值操作。
在 ES5 中，我们需要编写一个 if 判断来判断 obj 是否为 null 或 undefined，在条件满足的情况下才能给 obj 赋值。
在 ES6 中，使用 ??= 运算符可以直接完成相应的赋值操作，大大减少了代码的复杂度。
总结
通过使用 Logical Assignment 运算符，我们可以更加方便地对变量进行赋值操作，减少了不必要的 if/else 语句，使代码更加简洁易懂。
无论是在新的项目中，还是在维护既有项目时，适当地使用 Logical Assignment 运算符都可以提高代码的效率和可读性，是一种非常有用的编程技巧。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64698f0f968c7c53b09702ac