useCollapsedIf (JavaScript)

Language JavaScript (and super languages)

Summary

Rule available since: v1.9.4
Diagnostic Category: lint/style/useCollapsedIf
This rule isn’t recommended, so you need to enable it.
This rule has a safe fix.
The default severity of this rule is information.
Sources:
- Same as unicorn/no-lonely-if
- Same as collapsible_if

How to configure

1
{
2
  "linter": {
3
    "rules": {
4
      "style": {
5
        "useCollapsedIf": "error"
6
      }
7
    }
8
  }
9
}

Description

Enforce using single if instead of nested if clauses.

If an if (b) statement is the only statement in an if (a) block, it is often clearer to use an if (a && b) form.

Examples

Invalid

1
if (condition) {
2
    if (anotherCondition) {
3
        // ...
4
    }
5
}

code-block.js:2:5 lint/style/useCollapsedIf  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ℹ This if statement can be collapsed into another if statement.
  
    1 │ if (condition) {
  > 2 │     if (anotherCondition) {
      │     ^^^^^^^^^^^^^^^^^^^^^^^
  > 3 │         // ...
  > 4 │     }
      │     ^
    5 │ }
    6 │ 
  
  ℹ Nested if statements without an else can be written as one condition, which reduces nesting.
  
  ℹ Safe fix: Use collapsed if instead.
  
    1   │ - if·(condition)·{
    2   │ - ····if·(anotherCondition)·{
      1 │ + if·(condition·&&·anotherCondition)·{
    3 2 │           // ...
    4   │ - ····}
    5   │ - }
      3 │ + ····}
    6 4 │

1
if (condition) {
2
    // Comment
3
    if (anotherCondition) {
4
        // ...
5
    }
6
}

code-block.js:3:5 lint/style/useCollapsedIf ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ℹ This if statement can be collapsed into another if statement.
  
    1 │ if (condition) {
    2 │     // Comment
  > 3 │     if (anotherCondition) {
      │     ^^^^^^^^^^^^^^^^^^^^^^^
  > 4 │         // ...
  > 5 │     }
      │     ^
    6 │ }
    7 │ 
  
  ℹ Nested if statements without an else can be written as one condition, which reduces nesting.

Valid

1
if (condition && anotherCondition) {
2
    // ...
3
}

1
if (condition) {
2
    if (anotherCondition) {
3
        // ...
4
    }
5
    doSomething();
6
}

1
if (condition) {
2
    if (anotherCondition) {
3
        // ...
4
    } else {
5
        // ...
6
    }
7
}