JavaScript Question Mark (?) Operator Explained

The question mark operator is used in JavaScript as an alternative to an if statement, especially where a value is assigned based on a conditional.

Written by Dr. Derek Austin
Confused engineer representing question mark operator
Image: Shutterstock / Built In
Brand Studio Logo
UPDATED BY
Abel Rodriguez | Jul 17, 2025
Summary: The JavaScript question mark operator, or ternary operator, offers a concise alternative to if...else statements. It evaluates a condition and returns one of two values, streamlining variable assignment but potentially reducing code readability if overused.

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.

JavaScript Question Mark Operator Definition

JavaScript’s question mark operator ? , also known as question — colon or the ternary operator, is used to shorten an if else statement into one line of code. It takes three operands: a condition, a value if that condition is true and a value if that condition is false.

The first time you come across the ? character in your JavaScript code, it jumps off the screen. You might wonder, like I did, what a question mark was doing in your code. 

Thankfully, the question mark (or question mark — colon) syntax is easy to understand. However, overusing the ? : can make code hard to read.

 

What Is the JavaScript Question Mark Operator?

The question mark operator is formally known as the ternary operator because it takes three operands. It is sometimes informally referred to as the “question-colon” due to its syntax. While the syntax is pretty straight forward, describing the JavaScript question mark ? out loud can be difficult due to its terminology.

The question mark operator ? takes three operands: a condition, a value if that condition is true and a value if that condition is false.

It’s used in JavaScript to shorten an if else statement to one line of code.

More on JavaScriptHow to Check for Null in JavaScript

 

JavaScript Ternary Operator Explained

The question mark is also called the ternary operator because it takes three operands. Ternary means composed of three parts:

  1. The condition lives in parentheses.
  2. The value if true comes first.
  3. 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.

 

How to Correctly Use the JavaScript Question Mark Operator 

Question marks are useful in JavaScript for quickly assigning a different value to a variable based on a condition, a very common task:

let [profit, costs] = [120000, 100000] // It was a good month 
// Employee bonus structure: $1000 if >10% profit, $100 if not
let employeeBonus = (profit/costs > 1.10) ? 1000 : 100
console.log("$"+employeeBonus) // $1000

The determination of the bonus only takes one line, so I’m able to save time that I would have spent writing if, else and {} blocks.

Technically, the parentheses are optional, but they improve readability:

employeeBonus = profit/costs > 1.10 ? 1000 : 100
An introduction to the ternary operator in JavaScript. | Video: freeCodeCamp.org

More on JavaScriptHow to Check for Null in JavaScript

 

Common JavaScript Question Mark Operator Mistakes  

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:

(employeeBonus>500) ? console.log("🥳") : console.log("🙂") // 🥳

Compare this to the alternative, written with an if statement:

if (employeeBonus>500)
  { console.log("🥳") }
else
  { console.log("🙂") } // 🥳

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.

let monthProfitOrLoss = (profit > costs) ? "Profit" : "Loss"
console.log(`${monthProfitOrLoss} last month`) // Profit last month

In other cases, where I am taking some action if something is true, then I try to stick with if statements to make my code clearer.

Frequently Asked Questions

The question ternary operator, also known as the mark operator, is a shorthand for if...else statements that assigns values based on a condition in a single line of code.

It’s called the ternary operator because it takes three operands: a condition, a result if the condition is true, and a result if the condition is false.

The syntax is: condition ? valueIfTrue : valueIfFalse. For example: (1 + 1 == 2) ? "Pass" : "Fail".

Use the ternary operator when assigning a value based on a simple condition. It helps keep code concise and readable in those scenarios.

Explore Job Matches.