no-mixed-operators

用括号括起复杂的表达式可以明确开发人员的意图，从而使代码更具可读性。此规则会在表达式中连续使用不含运算符的不同运算符时发出警告。

var foo = a && b || c || d;    /*BAD: Unexpected mix of '&&' and '||'.*/
var foo = (a && b) || c || d;  /*GOOD*/
var foo = a && (b || c || d);  /*GOOD*/

注意：对于这条规则，预计会为一对中的每个混合运算符发出一个错误。因此，对于每使用两个连续的混合运算符，都会显示一个明显的错误，指出使用违反规则的特定运算符的位置：

var foo = a && b || c || d;

会产生

1:13  Unexpected mix of '&&' and '||'. (no-mixed-operators)
1:18  Unexpected mix of '&&' and '||'. (no-mixed-operators)

规则细节

这个规则检查BinaryExpression和LogicalExpression。

这个规则可能与没有额外规则的规则相冲突。如果你同时使用这个和没有额外规则的规则，你需要使用nestedBinaryExpressions no-extra-parens 规则的选项。

此规则的错误代码示例：

/*eslint no-mixed-operators: "error"*/

var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a + b * c;

此规则的正确代码示例：

/*eslint no-mixed-operators: "error"*/

var foo = a || b || c;
var foo = a && b && c;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 || c > 0 || d + 1 === 0);
var foo = a + (b * c);
var foo = (a + b) * c;

Options

{
    "no-mixed-operators": [
        "error",
        {
            "groups": [
                ["+", "-", "*", "/", "%", "**"],
                ["&", "|", "^", "~", "<<", ">>", ">>>"],
                ["==", "!=", "===", "!==", ">", ">=", "<", "<="],
                ["&&", "||"],
                ["in", "instanceof"]
            ],
            "allowSamePrecedence": true
        }
    ]
}

该规则有2个选项。

groups（string[][]） - 指定要检查的运算符组。该groups选项是组的列表，而组是二进制运算符的列表。默认的运算符组定义为算术运算符，位运算符，比较运算符，逻辑运算符和关系运算符。

allowSamePrecedence（boolean） - 指定是否允许混合运算符具有相同的优先级。默认是true。

groups

可以选择使用以下运算符groups：

算术运算符："+"，"-"，"*"，"/"，"%"，"**"

位运算符："&"，"|"，"^"，"~"，"<<"，">>"，">>>"

比较运算符："=="，"!="，"==="，"!=="，">"，">="，"<"，"<="

逻辑运算符："&&"，"||"

关系运算符："in"，"instanceof"

现在，考虑下面的组配置：{"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}。在此配置中指定了2组：位运算符和逻辑运算符。该规则检查操作员是否仅属于同一组。在这种情况下，该规则检查按位运算符和逻辑运算符是否混合，但忽略所有其他运算符。

此规则的代码错误代码示例{"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}如下：

/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/

var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a & b | c;

具有以下选项的此规则的正确代码示例{"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}：

/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/

var foo = a || b > 0 || c + 1 === 0;
var foo = a && b > 0 && c + 1 === 0;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 ||  c > 0 || d + 1 === 0);
var foo = (a & b) | c;
var foo = a & (b | c);
var foo = a + b * c;
var foo = a + (b * c);
var foo = (a + b) * c;

allowSamePrecedence

具有以下选项的此规则的正确代码示例{"allowSamePrecedence": true}：

/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": true}]*/

// + and - have the same precedence.
var foo = a + b - c;

此规则的代码错误代码示例{"allowSamePrecedence": false}如下：

/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": false}]*/

// + and - have the same precedence.
var foo = a + b - c;

何时不使用它

如果您不想收到关于混合运营商的通知，那么禁用此规则是安全的。

规则细节

Options

groups

allowSamePrecedence

何时不使用它

相关规则