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*/
1
2
3

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

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

将会生成

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

规则详情

此规则检查 BinaryExpression、LogicalExpression 和 ConditionalExpression。

此规则可能与 no-extra-parens 规则冲突。如果您同时使用此规则和 no-extra-parens 规则，则需要使用 no-extra-parens 规则的 nestedBinaryExpressions 选项。

此规则的错误代码示例

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

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

此规则的正确代码示例

/*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;
1
2
3
4
5
6
7
8

选项

{
    "no-mixed-operators": [
        "error",
        {
            "groups": [
                ["+", "-", "*", "/", "%", "**"],
                ["&", "|", "^", "~", "<<", ">>", ">>>"],
                ["==", "!=", "===", "!==", ">", ">=", "<", "<="],
                ["&&", "||"],
                ["in", "instanceof"]
            ],
            "allowSamePrecedence": true
        }
    ]
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

此规则有 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;
1
2
3
4

/*eslint no-mixed-operators: ["error", {"groups": [["&&", "||", "?:"]]}]*/

var foo = a || b ? c : d;

var bar = a ? b || c : d;

var baz = a ? b : c || d;
1
2
3
4
5
6
7

使用 {"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;
1
2
3
4
5
6
7
8
9
10
11

/*eslint no-mixed-operators: ["error", {"groups": [["&&", "||", "?:"]]}]*/

var foo = (a || b) ? c : d;
var foo = a || (b ? c : d);

var bar = a ? (b || c) : d;

var baz = a ? b : (c || d);
var baz = (a ? b : c) || d;
1
2
3
4
5
6
7
8
9

allowSamePrecedence

使用 {"allowSamePrecedence": true} 选项时，此规则的正确代码示例

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

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

使用 {"allowSamePrecedence": false} 选项时，此规则的错误代码示例

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

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

使用 {"allowSamePrecedence": false} 选项时，此规则的正确代码示例

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

// + and - have the same precedence.
var foo = (a + b) - c;
1
2
3
4

何时不使用它

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

相关规则

• no-extra-parens

版本

此规则在 ESLint v2.12.0 中引入。

资源

• 规则来源
• 测试来源