这条 JS 线是如何工作的？

Question

我正在阅读第三方 javascript 库的代码，它有以下行：

x2 = x1 - minWidth * (x2 < x1 || -1);

x1、x2、minWidth 都是数字

我想知道 (x2 < x1 || -1) 部分。这里的比较运算符是如何工作的？

Answer 1

英文是说如果x2小于x1 return为真，否则return -1。 true 转换为 1，所以归结为 minWidth * 1 or -1

数字示例：

minWidth = 5、x1 = 3、x2 = 2。 x2 = 5 * (true OR -1)

减少：x2 = 5*true = x2 = 5*1

所以这是一种产生负值或正值转换的方法。

Answer 2

首先，让我们看一下短路。假设你有一行

var A = B || C;

如果 B 是 truthy 值，则 A 将设置为 B。如果不是，则 A 将等于 C.

将其重新应用于您的情况，如果 x2 < x1 为真，则该表达式的结果将为 true。否则，结果将是 -1.

接下来，我们将考虑类型转换在 Javascript 中的工作原理。任何时候您使用给定值进行乘法运算时，该值都会被强制转换为一个数字。对于 true，该数字是 1。

最终，这意味着"if x2 >= x1, flip the sign of the min width."

Answer 3

该行的冗长等价物类似于，

if(x2 < x1){
    x2 = x1 - minWidth * 1;
} else {
    x2 = x1 - minwidth * -1;
}

在JavaScript中，true也等于1。知道这一点，你可以使用那个值来简化一些逻辑。

另外，||二元运算符将在到达 true 后立即继续。条件语句中 true 之后的所有内容都将被忽略。这叫做短路。

这就是您的示例中发生的情况。由于那部分条件的值为true时的值也等于1，所以作者省了一步直接用了那个值。

How does this JS line work?