eslint/docs/src/rules/multiline-ternary.md

   1 ---
   2 title: multiline-ternary
   3 layout: doc
   4 rule_type: layout
   5 related_rules:
   6 - operator-linebreak
   7 ---
   8
   9
  10
  11 JavaScript allows operands of ternary expressions to be separated by newlines, which can improve the readability of your program.
  12
  13 For example:
  14
  15 ```js
  16 var foo = bar > baz ? value1 : value2;
  17 ```
  18
  19 The above can be rewritten as the following to improve readability and more clearly delineate the operands:
  20
  21 ```js
  22 var foo = bar > baz ?
  23     value1 :
  24     value2;
  25 ```
  26
  27 ## Rule Details
  28
  29 This rule enforces or disallows newlines between operands of a ternary expression.
  30 Note: The location of the operators is not enforced by this rule. Please see the [operator-linebreak](operator-linebreak) rule if you are interested in enforcing the location of the operators themselves.
  31
  32 ## Options
  33
  34 This rule has a string option:
  35
  36 * `"always"` (default) enforces newlines between the operands of a ternary expression.
  37 * `"always-multiline"` enforces newlines between the operands of a ternary expression if the expression spans multiple lines.
  38 * `"never"` disallows newlines between the operands of a ternary expression.
  39
  40 ### always
  41
  42 This is the default option.
  43
  44 Examples of **incorrect** code for this rule with the `"always"` option:
  45
  46 ::: incorrect
  47
  48 ```js
  49 /*eslint multiline-ternary: ["error", "always"]*/
  50
  51 foo > bar ? value1 : value2;
  52
  53 foo > bar ? value :
  54     value2;
  55
  56 foo > bar ?
  57     value : value2;
  58 ```
  59
  60 :::
  61
  62 Examples of **correct** code for this rule with the `"always"` option:
  63
  64 ::: correct
  65
  66 ```js
  67 /*eslint multiline-ternary: ["error", "always"]*/
  68
  69 foo > bar ?
  70     value1 :
  71     value2;
  72
  73 foo > bar ?
  74     (baz > qux ?
  75         value1 :
  76         value2) :
  77     value3;
  78 ```
  79
  80 :::
  81
  82 ### always-multiline
  83
  84 Examples of **incorrect** code for this rule with the `"always-multiline"` option:
  85
  86 ::: incorrect
  87
  88 ```js
  89 /*eslint multiline-ternary: ["error", "always-multiline"]*/
  90
  91 foo > bar ? value1 :
  92     value2;
  93
  94 foo > bar ?
  95     value1 : value2;
  96
  97 foo > bar &&
  98     bar > baz ? value1 : value2;
  99 ```
 100
 101 :::
 102
 103 Examples of **correct** code for this rule with the `"always-multiline"` option:
 104
 105 ::: correct
 106
 107 ```js
 108 /*eslint multiline-ternary: ["error", "always-multiline"]*/
 109
 110 foo > bar ? value1 : value2;
 111
 112 foo > bar ?
 113     value1 :
 114     value2;
 115
 116 foo > bar ?
 117     (baz > qux ? value1 : value2) :
 118     value3;
 119
 120 foo > bar ?
 121     (baz > qux ?
 122         value1 :
 123         value2) :
 124     value3;
 125
 126 foo > bar &&
 127     bar > baz ?
 128         value1 :
 129         value2;
 130 ```
 131
 132 :::
 133
 134 ### never
 135
 136 Examples of **incorrect** code for this rule with the `"never"` option:
 137
 138 ::: incorrect
 139
 140 ```js
 141 /*eslint multiline-ternary: ["error", "never"]*/
 142
 143 foo > bar ? value :
 144     value2;
 145
 146 foo > bar ?
 147     value : value2;
 148
 149 foo >
 150     bar ?
 151     value1 :
 152     value2;
 153 ```
 154
 155 :::
 156
 157 Examples of **correct** code for this rule with the `"never"` option:
 158
 159 ::: correct
 160
 161 ```js
 162 /*eslint multiline-ternary: ["error", "never"]*/
 163
 164 foo > bar ? value1 : value2;
 165
 166 foo > bar ? (baz > qux ? value1 : value2) : value3;
 167
 168 foo > bar ? (
 169     baz > qux ? value1 : value2
 170 ) : value3;
 171 ```
 172
 173 :::
 174
 175 ## When Not To Use It
 176
 177 You can safely disable this rule if you do not have any strict conventions about whether the operands of a ternary expression should be separated by newlines.
 178
 179 ## Compatibility
 180
 181 * **JSCS**: [requireMultiLineTernary](https://jscs-dev.github.io/rule/requireMultiLineTernary)