ES12 提供了逻辑赋值表达式来简化前端开发中的赋值操作。逻辑赋值表达式的作用是在变量赋值的同时进行逻辑操作，以简化代码并提高代码可读性和可维护性。在实际开发中，尤其是对于需要进行大量复杂的赋值操作的场景，使用逻辑赋值表达式可以帮助我们避免重复的赋值，提升代码开发效率和可维护性。
逻辑赋值表达式的基本语法：
逻辑赋值表达式是由逻辑运算符和赋值运算符组成的，语法结构如下所示：
let a = 1; let b = 2; a ||= b;
上面的代码中，||= 是一个逻辑赋值表达式，表示“a 的值如果为 false 或者 undefined，那么将 b 的值赋给 a ”。如果 a 的值为 true 或者非 undefined 的值，那么这个表达式将不做任何操作。
逻辑赋值表达式还有其他几种形式，具体如下所示：
a &&= b; // 如果 a 的值不为 false，将 b 的值赋给 a a ??= b; // 如果 a 的值为 undefined，将 b 的值赋给 a a += b; // 将 a 和 b 相加后的值赋给 a a -= b; // 将 a 和 b 相减后的值赋给 a a *= b; // 将 a 和 b 相乘后的值赋给 a a /= b; // 将 a 和 b 相除后的值赋给 a ...
逻辑赋值表达式的应用场景：
逻辑赋值表达式的主要应用场景是在变量赋值的同时进行逻辑操作，例如：
-- -------------------- ---- ------- --- - - -- --- -- --- - - -- --- -- -- ----- -- ---- - - - - -- -- - -- ---- - - - -- - -- ---------- - --- - -- -- - --- --
上述代码中，如果变量 a 的值为 false 或 undefined，那么将 b 或 c 的值赋给它。如果变量 d 的值为 undefined，则将变量 c 的值赋给它。使用逻辑赋值表达式可以将传统写法中的 if 语句简化为一行代码，提高了代码的可读性和可维护性。
逻辑赋值表达式还可以用于实现复杂的计算逻辑。例如，下面的代码是通过逻辑赋值表达式实现自动加法计算的例子：
-- -------------------- ---- ------- --- --- - -- --- ---- - -- --- ---- - -- --- ---- - -- --- -- ---- --- ---- -- ----- ----------------- -- - ------------------ -- - ------------------ -- - ------------------ -- -
上述代码中，+= 是一个逻辑赋值表达式，它首先执行了 num2 += num3，将 num2 的值变为了 5，然后才将 num1 的值赋给 sum，因此最终的结果是 6。值得注意的是，因为逻辑赋值表达式是从左向右计算的，因此 num1 不会被 num2 += num3 影响，仍然保持其原来的值 1。
结论
逻辑赋值表达式是 ES12 中一个非常实用的新特性，在前端开发中广泛应用。他可以帮助我们避免重复的赋值，提高代码的开发效率和可维护性，在代码的可读性方面也大有裨益。有了逻辑赋值表达式，我们可以更简洁、更高效地编写代码，轻松地应对更复杂的场景和需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6752ca788bd460d3ad9898d6