I've looked at somewhat similar questions like this or this but they are answering a different question as they look at assignment operations. For example my code is
!item.completed ? addTask[item] : null
as I would like to execute a certain function if condition is met or do nothing if it's not met. My question is what would be considered a good practice to pass as an 'empty' 2nd expression?
I saw a lot of people using null
, on the other hand I think that using an empty string ''
is also a valid option as since there is no assignment happening an empty string is faster to type
and doesn't seem to have any cons.
asked Dec 2, 2016 at 20:51
4
You could
use logical or ||
item.completed || addTask[item]
answered Dec 2, 2016 at 20:53
Nina ScholzNina Scholz
360k24 gold badges322 silver badges365 bronze badges
1
I think this is not a good use of the ternary operator.
I'd either do:
if [!item.completed] addTask[item];
Or
!item.completed && addTask[item];
answered Dec 2, 2016 at 20:54
plalxplalx
41.7k5 gold badges70 silver badges88 bronze badges
You could use:
!item.completed && addTask[item];
There's no point using a ternary if you don't need it.
Cjmarkham
9,1544 gold badges47 silver badges80 bronze badges
answered Dec 2, 2016 at 20:54
The conditional [ternary] operator is the only JavaScript operator that takes three operands: a condition followed by a question mark [?
], then an expression to execute if the condition is truthy followed by a colon [:
], and finally the expression to execute if the condition is
falsy. This operator is frequently used as an alternative to an if...else
statement. Try it
Syntax
condition ? exprIfTrue : exprIfFalse
Parameters
condition
An expression whose value is used as a condition.
exprIfTrue
An expression which is executed if the condition
evaluates to a truthy value [one
which equals or can be converted to true
].
exprIfFalse
An expression which is executed if the condition
is falsy [that is, has a value which can be converted to false
].
Description
Besides false
, possible falsy expressions are: null
, NaN
, 0
, the empty string [""
], and undefined
. If condition
is any of these, the result of the conditional expression will be the result of executing the expression exprIfFalse
.
Examples
A simple example
const age = 26;
const beverage = age >= 21 ? "Beer" : "Juice";
console.log[beverage]; // "Beer"
Handling null values
One common usage is to handle a value that may be null
:
const greeting = [person] => {
const name = person ? person.name : "stranger";
return `Howdy, ${name}`;
}
console.log[greeting[{ name: "Alice" }]]; // "Howdy, Alice"
console.log[greeting[null]]; // "Howdy, stranger"
Conditional chains
The ternary operator is right-associative, which means it can be "chained" in the following way, similar to an if … else if … else if … else
chain:
function example[] {
return condition1 ? value1
: condition2 ? value2
: condition3 ? value3
: value4;
}
This is equivalent to the following
if...else
chain.
function example[] {
if [condition1] {
return value1;
} else if [condition2] {
return value2;
} else if [condition3] {
return value3;
} else {
return value4;
}
}
Specifications
ECMAScript Language Specification # sec-conditional-operator |
Browser compatibility
BCD tables only load in the browser