The question mark ? is an alternative to an if statement best used in the case where one of two values will be assigned to a variable based on a conditional statement.
Photo by Jens Lelie on Unsplash
The purpose of the question mark operator ? is to return one value or another depending on its condition. ? JavaScript.info in August 2019
?A ?? ?What is a ? doing in my JavaScript code?? The ? character jumped off the screen when it showed up in my JavaScript programming.
Thankfully, the question mark (or question mark ? colon) syntax is easy to understand, but overusing the ? : can make code hard to read.
The question mark is used in JavaScript as an alternative to an if statement, especially in the case where a value is assigned based on a conditional.
Photo by Murat Dzyurt on Unsplash
A question mark by another name
[The] ?question mark? or ?conditional? operator in JavaScript is a ternary operator that has three operands. ? GeeksForGeeks
It has many names: question mark, question ? colon, ternary operator. While the syntax is pretty straight forward, describing the JavaScript question mark ? aloud can be difficult due to its terminology.
The question mark operator ? takes three operands: some condition, a value if that condition is true, and a value if that condition is false.
It is used in JavaScript to shorten an if else statement to one line of code.
Photo by Saketh Garuda on Unsplash
Three of a kind ? the ternary opreator
The conditional (ternary) operator is the only JavaScript operator that takes three operands. This operator is frequently used as a shortcut for the if statement. ? MDN Web Docs
As an operator taking three operands, the question mark is also called the ternary operator ? with ternary meaning composed of three parts:
- The condition lives in parentheses
- The value if true comes first
- The value if false comes second
The three operands look like this: (1+1==2) ? “Pass” : “Fail”. The question mark and colon operators together are the ternary operator.
Photo by Veronica Reverse on Unsplash
Take a look at my ?
Question marks are useful in JavaScript for quickly assigning a different value to a variable based on a condition, a very common task.
The determination of the bonus only takes one line, so I am able to use the save time that I would have spent writing if, else, and {} blocks.
Technically the parentheses are optional, but they improve readability:
Photo by Cosmic Timetraveler on Unsplash
Watch out for ?
Most developers think this code is hard to read, even though the question mark operator let me write it in just a single line of code:
Compare this to the alternative, written with an if statement:
The typical best practice is to reserve the question mark for cases of assigning variables, when it makes sense to use the question ? colon in JavaScript.
In other cases, where I am taking some action if something is true, then I try to stick with if statements so as to make my code clearer.
Photo by Michal Mrozek on Unsplash
Additional resources
- Tania Rascia explains conditional statements on DigitalOcean:
If Statements, If Else Statements, Nested If, Ternary Operators | DigitalOcean
In programming, there will be many occasions in which you will want different blocks of code to run depending on user?
www.digitalocean.com
- Stephen Chapman explains what he likes about the ? on ThoughtCo:
An Effective Shortcut Using the ‘Ternary’ Operator in JavaScript
The conditional ternary operator in JavaScript assigns a value to a variable based on some condition and is the only?
www.thoughtco.com
- Brandon Morelli likes how terse the ternary operator is on codeburst.io: