逻辑赋值是对现有数学和二元逻辑运算符的扩展。让我们先回顾一下它们，看看将它们组合起来能得到什么。首先，让我们看一下JS中条件运算符和无条件运算符的区别。无条件与条件数学运算符（例如+）是无条件的。在constx=1+2中，我们总是将LHS与RHS相加，无论如何，并将结果赋值给x。LHS和RHS是数学领域的概念，意思是等式左边和等式右边。在我们当前的场景中，它们是赋值运算符的左侧和右侧。当变量出现在赋值运算符的左侧时，进行LHS查询；否则，执行RHS查询。我们甚至可以写一些奇怪的代码，比如constx=false+2。JS先把false的LHS转成Number，所以得到constx=Number(false)+2，结果是constx=0+2，把LHS加上RHS，最后赋值给x，得到2.&&等逻辑运算符是有条件的在constx=true&&0+2中，首先计算LHS，为真。由于LHS计算结果为真，我们接下来运行RHS操作，计算结果为2，还运行赋值操作，计算结果为2。与constx=false&&0+2相比，LHS为假，因此RHS被完全忽略.您可能想知道为什么要避免计算RHS？两个常见的原因是获得更好的性能和避免副作用。二元逻辑运算符&&||？？在JSX中我们经常使用&&和||有条件地呈现界面。？？是nullish（空值）合并运算符，这是最近提出来的，很快就会流行起来。它们是二元逻辑运算符。使用&&来检验LHS的结果是否为真值。使用||测试LHS的结果是否为假值。使用？？测试LHS是否无效。FalsevaluevsNullishJS中的falsevalues有哪些？nullundefinedfalseNaN0""（空字符串）以下两个姐妹被视为空值。nullundefined值得注意的是，使用二元逻辑运算符不一定返回布尔值，而是返回表达式的LHS或RHS值。为了阐明这些表达式类型的要点，回顾一下ECMAScript文档中的这句话会很有帮助：&&或||产生的值不一定是布尔值，而是两个操作数表达式值之一。一些例子//&&///如果LHS为真，计算并返回RHS，否则返回LHStrue&&100**2//10000"Joe"&&"JavaScript"//"JavaScript"false&&100**2//false""&&100**2//""NaN&&100**2//NaNnull&&100**2//nullundefined&&100**2//undefined逻辑赋值运算符&&=||=??=This运算符将赋值与条件逻辑运算符结合在一起，因此得名“逻辑赋值”。它们只是简写，例如x&&=y是x&&(x=y)的简写。从逻辑赋值返回的值不是更新后的赋值，而是计算表达式的值。由于以前的ECMAScript特性，例如默认参数和nullish合并运算符，您可能会争辩说逻辑赋值提供的功能肯定存在一些冗余。虽然这个简写看起来很巧妙，但我相信随着我们发现更多用例，它会派上用场。逻辑与赋值(&&=)//逻辑与LHS&&=RHS//等同于LHS&&(LHS=RHS)//示例//如果x为真，则将x赋值给y，否则返回x//如果x为真值，则将y赋值给x，否则返回xletx=1consty=100x&&=y//x为100//对应的长写法x&&(x=y)逻辑或赋值(||=)//逻辑或LHS||=RHS//等价于LHS||(LHS=RHS)//示例//如果x为真，则返回x，否则将y分配给xletx=NaNconsty=100x||=y//x是100//上面对应的长形式x||(x=y)逻辑空值赋值(??=)//逻辑空值LHS??=RHS//等同于LHS??(LHS=RHS)//Example//如果x.z为nullish，则将x.z分配给yletx={}lety=100;x.z??=y//xis{z:100}//上面对应的长格式Examplex.z中的逻辑赋值??(x.z=y)implementationJSXletinReactloading=trueconstspinner=
