# 禁止混合使用不同的操作符 (no-mixed-operators)

Enclosing complex expressions by parentheses clarifies the developer’s intention, which makes the code more readable. This rule warns when different operators are used consecutively without parentheses in an expression.

``````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*/
``````

Note:

It is expected for this rule to emit one error for each mixed operator in a pair. As a result, for each two consecutive mixed operators used, a distinct error will be displayed, pointing to where the specific operator that breaks the rule is used:

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

will generate

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

## Rule Details

This rule checks `BinaryExpression` and `LogicalExpression`.

This rule may conflict with no-extra-parens rule. If you use both this and no-extra-parens rule together, you need to use the `nestedBinaryExpressions` option of no-extra-parens rule.

Examples of incorrect code for this rule:

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

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

Examples of correct code for this rule:

``````/*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
}
]
}
``````

This rule has 2 options.

• `groups` (`string[][]`) - specifies operator groups to be checked. The `groups` option is a list of groups, and a group is a list of binary operators. Default operator groups are defined as arithmetic, bitwise, comparison, logical, and relational operators.
• `groups` (`string[][]`) - 指定要检查的操作符分组。`groups` 选项是分组的列表，分组是二进制运算符的列表。默认操作符分组定义为算术、位、比较、逻辑和关系运算符。
• `allowSamePrecedence` (`boolean`) - specifies whether to allow mixed operators if they are of equal precedence. Default is `true`.
• `allowSamePrecedence` (`boolean`) - 指定是否允许混合运算符具有相同的优先级。默认为 `true`

### groups

The following operators can be used in `groups` option:

• Arithmetic Operators: `"+"`, `"-"`, `"*"`, `"/"`, `"%"`, `"**"`
• 算数操作符：`"+"``"-"``"*"``"/"``"%"``"**"`
• Bitwise Operators: `"&"`, `"|"`, `"^"`, `"~"`, `"<<"`, `">>"`, `">>>"`
• 位操作符：`"&"``"|"``"^"``"~"``"<<"``">>"``">>>"`
• Comparison Operators: `"=="`, `"!="`, `"==="`, `"!=="`, `">"`, `">="`, `"<"`, `"<="`
• 比较操作符：`"=="``"!="``"==="``"!=="``">"``">="``"<"``"<="`
• Logical Operators: `"&&"`, `"||"`
• 逻辑操作符：`"&&"``"||"`
• Relational Operators: `"in"`, `"instanceof"`
• 关系操作符：`"in"``"instanceof"`

Now, consider the following group configuration: `{"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}`. There are 2 groups specified in this configuration: bitwise operators and logical operators. This rule checks if the operators belong to the same group only. In this case, this rule checks if bitwise operators and logical operators are mixed, but ignores all other operators.

Examples of incorrect code for this rule with `{"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}` option:

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

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

Examples of correct code for this rule with `{"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}` option:

``````/*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

Examples of correct code for this rule with `{"allowSamePrecedence": true}` option:

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

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

Examples of incorrect code for this rule with `{"allowSamePrecedence": false}` option:

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

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

Examples of correct code for this rule with `{"allowSamePrecedence": false}` option:

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

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

## When Not To Use It

If you don’t want to be notified about mixed operators, then it’s safe to disable this rule.

## Version

This rule was introduced in ESLint 2.12.0.