Control Statements

  • 17.1 In case your control statement (if, while etc.) gets too long or exceeds the maximum line length, each (grouped) condition could be put into a new line. The logical operator should begin the line.

    Why? Requiring operators at the beginning of the line keeps the operators aligned and follows a pattern similar to method chaining. This also improves readability by making it easier to visually follow complex logic.

    1. // bad
    2. if ((foo === 123 || bar === 'abc') && doesItLookGoodWhenItBecomesThatLong() && isThisReallyHappening()) {
    3.   thing1();
    4. }
    6. // bad
    7. if (foo === 123 &&
    8.   bar === 'abc') {
    9.   thing1();
    10. }
    12. // bad
    13. if (foo === 123
    14.   && bar === 'abc') {
    15.   thing1();
    16. }
    18. // bad
    19. if (
    20.   foo === 123 &&
    21.   bar === 'abc'
    22. ) {
    23.   thing1();
    24. }
    26. // good
    27. if (
    28.   foo === 123
    29.   && bar === 'abc'
    30. ) {
    31.   thing1();
    32. }
    34. // good
    35. if (
    36.   (foo === 123 || bar === 'abc')
    37.   && doesItLookGoodWhenItBecomesThatLong()
    38.   && isThisReallyHappening()
    39. ) {
    40.   thing1();
    41. }
    43. // good
    44. if (foo === 123 && bar === 'abc') {
    45.   thing1();
    46. }

  • 17.2 Don’t use selection operators in place of control statements.

    1. // bad
    2. !isRunning && startRunning();
    4. // good
    5. if (!isRunning) {
    6.   startRunning();
    7. }