JavaScript ECMAScript 2021（ES12）引入了两个新的逻辑赋值运算符：&&= 和 ||=。这两个运算符可以使代码变得更加简洁和易读。有兴趣的读者可以跟着本文了解它们的原理和用法。
&&= 运算符
在 ES11 之前，我们可能编写了这样的代码：
--- - - -- -- --------------- - - - - -- -- -
上面的代码意思是，如果 someCondition 为真，那么将原来的 x 值与 2 取交集并赋值给 x。也就是说，只有当 x 的值为真时，才会将 2 赋值给 x。
上面的代码可以使用新的 &&= 运算符更简洁地实现：
--- - - -- ------------- --- --
上面的代码与之前的代码具有相同的行为：如果 someCondition 为真，则将 2 赋值给 x。
注意：如果 someCondition 的值为假，则 x 不会被修改。
||= 运算符
同样，以前我们可能会写下这样的代码：
--- - - -- -- ---- - - - -- -
上面的代码意思是，如果 x 值为假，那么将 x 赋值为 2。这也可以使用新的 ||= 运算符更简洁地实现：
--- - - -- - --- --
上面的代码与之前的代码具有相同的行为：如果 x 值为假，则将其赋值为 2。
注意：如果 x 值为真，则 x 不会被修改。
结论
ES12 中新增的逻辑赋值运算符 &&= 和 ||=，可以使代码更加简洁和易读。它们的使用场景包括为变量设置默认值、更新变量的值、以及过滤数组等。这两个运算符并不会为代码功能带来太大的变化，但对代码编写效率和可读性的提升是非常明显的。
示例代码
下面是一些使用逻辑赋值运算符的示例代码。
-- -------- --- -- - --- -- --------------- -- - -- ------ --- - - -- - --- -- --------------- -- - -- ---- ----- ------- - --- -- -- --- --- ------ -- --------------------- - ----- - -- - ---- - ----- - -- - ------------------- -- - -- ---------------- ----- - ------------------- - - - -- ------------------- -- - ----- --- -- ------------------- -- - ---------------- ----- --- -- ------------------- -- -
在上面的示例代码中，我们使用了逻辑赋值运算符来简化代码，并使代码更易读和易维护。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/67185bb2ad1e889fe22a694d