JavaScript allows operands of ternary expressions to be separated by newlines, which can improve the readability of your program.
For example:
var foo = bar > baz ? value1 : value2;
The above can be rewritten as the following to improve readability and more clearly delineate the operands:
var foo = bar > baz ?
value1 :
value2;
This rule enforces or disallows newlines between operands of a ternary expression. Note: The location of the operators is not enforced by this rule. Please see the operator-linebreak rule if you are interested in enforcing the location of the operators themselves.
This rule has a string option:
"always"
(default) enforces newlines between the operands of a ternary expression."always-multiline"
enforces newlines between the operands of a ternary expression if the expression spans multiple lines."never"
disallows newlines between the operands of a ternary expression (enforcing that the entire ternary expression is on one line).
This is the default option.
Examples of incorrect code for this rule with the "always"
option:
/*eslint multiline-ternary: ["error", "always"]*/
foo > bar ? value1 : value2;
foo > bar ? value :
value2;
foo > bar ?
value : value2;
Examples of correct code for this rule with the "always"
option:
/*eslint multiline-ternary: ["error", "always"]*/
foo > bar ?
value1 :
value2;
foo > bar ?
(baz > qux ?
value1 :
value2) :
value3;
Examples of incorrect code for this rule with the "always-multiline"
option:
/*eslint multiline-ternary: ["error", "always-multiline"]*/
foo > bar ? value1 :
value2;
foo > bar ?
value1 : value2;
foo > bar &&
bar > baz ? value1 : value2;
Examples of correct code for this rule with the "always-multiline"
option:
/*eslint multiline-ternary: ["error", "always-multiline"]*/
foo > bar ? value1 : value2;
foo > bar ?
value1 :
value2;
foo > bar ?
(baz > qux ? value1 : value2) :
value3;
foo > bar ?
(baz > qux ?
value1 :
value2) :
value3;
foo > bar &&
bar > baz ?
value1 :
value2;
Examples of incorrect code for this rule with the "never"
option:
/*eslint multiline-ternary: ["error", "never"]*/
foo > bar ? value :
value2;
foo > bar ?
value : value2;
foo >
bar ?
value1 :
value2;
Examples of correct code for this rule with the "never"
option:
/*eslint multiline-ternary: ["error", "never"]*/
foo > bar ? value1 : value2;
foo > bar ? (baz > qux ? value1 : value2) : value3;
If this rule is invoked with the command-line --fix
option, it's recommended to define both indent
and operator-linebreak
if you want to have sensible results when using the always
and always-multiline
options.
For instance, this code:
const func = () => {
const items = hasStuff ? [
...stuff.items,
...previousStuff.items,
] : previousStuff.items
}
Is converted to:
const func = () => {
const items = hasStuff
? [
...stuff.items,
...previousStuff.items,
]
: previousStuff.items
}
But can be converted to depending on your indent
value:
const func = () => {
const items = hasStuff
? [
...stuff.items,
...previousStuff.items,
]
: previousStuff.items
}
Or even this way depending on your operator-linebreak
value:
const func = () => {
const items = hasStuff ?
[
...stuff.items,
...previousStuff.items,
] :
previousStuff.items
}
The way it choses how to automatically fix depends on how your ternaries were formatted prior to running --fix
, but with indent
and operator-linebreak
, you'll achieve consistent results.
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.
- JSCS: requireMultiLineTernary