Say you have

var foo = {};

The line that is confusing you would be

foo.bar = foo.bar ? foo.bar + 1 : 1; // line A

Ask yourself

  1. What is foo.bar at the start? It is undefined, we didn't give foo a property bar
  2. What is foo.bar after the first time line A is executed? It is 1; foo.bar was undefined which is falsy so the ternary operator gave us back 1
  3. What is foo.bar after the second time line A is executed? It is 2; foo.bar was 1 which is truthy, so the ternary operator gave us back foo.bar + 1

Line A can be repeated until you run out of numbers or the world explodes

Writing it like this is a way to solve the undefined + 1 problem, which would give NaN


An equally valid solution (which I find a bit cleaner to read personally) would be to do

foo.bar = (foo.bar || 0) + 1;
Answer from Paul S. on Stack Overflow
🌐
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › JavaScript › Reference › Operators › Conditional_operator
Conditional (ternary) operator - JavaScript | MDN
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.
🌐
Medium
medium.com › @ykods › understanding-the-ternary-operator-in-javascript-b2b7b2184321
Understanding the Ternary Operator in JavaScript | Yeran Kods | Medium
February 7, 2025 - The ternary operator (? :) is a shorthand way of writing an if-else statement in JavaScript and many other programming languages. It is often used to make conditional assignments more concise and readable.
🌐
JavaScript Tutorial
javascripttutorial.net › home › javascript tutorial › javascript ternary operator
JavaScript Ternary Operator
November 15, 2024 - In this example, the returned value of the ternary operator is the last value in the comma-separated list. ... If the locked is 1, then the canChange variable is set to false, otherwise, it is set to true. In this case, you can simplify it by using a Boolean expression as follows: let locked = 1; let canChange = locked != 1;Code language: JavaScript (javascript)
🌐
Programiz
programiz.com › javascript › ternary-operator
JavaScript Ternary Operator (with Examples)
In this tutorial, you will learn about the conditional/ternary operator in JavaScript with the help of examples.
🌐
GeeksforGeeks
geeksforgeeks.org › javascript-ternary-operator
JavaScript Ternary Operator | GeeksforGeeks
The ternary operator allows you to quickly decide between two values depending on whether a condition is true or false. ... Condition: A condition that evaluates to true or false. expressionIfTrue: The value or expression is returned if the ...
Published   April 15, 2025
🌐
SitePoint
sitepoint.com › blog › javascript › quick tip: how to use the ternary operator in javascript
Quick Tip: How to Use the Ternary Operator in JavaScript — SitePoint
November 6, 2024 - If you don’t need to specify an action for the false condition, consider using an if statement instead. You can use the ternary operator with arrays in JavaScript to perform different actions based on the condition.
🌐
Medium
medium.com › @abidullah786 › mastering-js-shorthand-techniques-ternary-operators-arrays-methods-and-object-properties-50e087727fe4
Mastering JS Shorthand Techniques: Ternary Operators, Arrays Methods, and Object Properties | by Abidullah | Medium
August 10, 2023 - You can chain multiple ternary operators together for concise conditional statements based on multiple conditions. The exponentiation operator (**) raises the left operand to the power of the right operand. ES6 introduced a variety of array methods that provide concise alternatives for common operations.
Find elsewhere
🌐
freeCodeCamp
freecodecamp.org › news › the-ternary-operator-in-javascript
JavaScript Ternary Operator – Syntax and Example Use Case
January 6, 2023 - You cannot use the operator without assigning the returned value to a variable: const result = condition ? trueExpression : falseExpression · The returned value depends on the evaluation of the condition expression. If the condition is true, the returned value returned from trueExpression is assigned to the variable. Else, the returned value from falseExpression will be assigned to the variable. The ternary operator can be a good replacement for if statements in some cases.
🌐
W3Schools
w3schools.com › react › react_es6_ternary.asp
React ES6 Ternary Operator
The ternary operator is a simplified conditional operator like if / else. Syntax: condition ? <expression if true> : <expression if false> ... If you want to use W3Schools services as an educational institution, team or enterprise, send us an ...
🌐
egghead.io
egghead.io › lessons › javascript-use-some-as-a-ternary-operator-or-conditional
Use Some as a Ternary Operator or Conditional | egghead.io
some returns a boolean value after passing each item in the source array through the test function that you pass in as the first parameter. This makes it well suited to the types of queries that require a simple yes or no answer. In this lesson we look at 2 practical use-cases for some. The first shows how it can be used with a ternary operator to switch a class on an element & the second shows how some can be used in an if conditional.
Published   December 23, 2015
🌐
DEV Community
dev.to › abidullah786 › mastering-javascript-shorthand-techniques-code-faster-and-cleaner-part-3-2mb9
Mastering JS Shorthand Techniques Part-3: Ternary Operators, Arrays Methods, and Object Properties - DEV Community
August 15, 2023 - It is a ternary operator because it takes 3 operands (similarly, binary operators take 2 operands, and unary operators take 1). It's sometimes referred to as the ternary operator as most languages only have one such operator.
🌐
W3Schools
w3schools.com › js › js_if_ternary.asp
JavaScript Conditional Ternary Operator
The conditional (ternary) operator is the only JavaScript operator that takes three operands.
🌐
Mimo
mimo.org › glossary › javascript › ternary-operator
JavaScript Ternary Operator: Syntax, Usage, and Examples
Write cleaner conditional logic in JavaScript using the ternary operator. Replace if...else with concise, readable expressions in a single line.
🌐
StudySmarter
studysmarter.co.uk › javascript ternary operator
Javascript Ternary Operator: Definition & Nested
Definition: The Javascript Ternary Operator is a conditional (ternary) statement that takes three operands: a condition followed by a question mark (?), then an expression to execute if the condition is true, followed by a colon (:), and finally an expression to execute if the condition is false.
🌐
Refine
refine.dev › home › blog › tutorials › how to use the javascript ternary operator
How to Use the JavaScript Ternary Operator | Refine
October 8, 2024 - As we can see, the Ternary Operator places the conditional expression before the ? and accepts the executable expressions as two other operands that are separated by a colon, :. If the conditionalExpression evaluates to a truthy value, exprIfTruthy is executed. If it evaluates to a falsy value, exprIfFalsy is executed. In JavaScript, a truthy value corresponds to a value that is considered equivalent to true had that been converted to a Boolean.
🌐
JavaScript in Plain English
javascript.plainenglish.io › javascript-tip-conditionally-add-an-item-to-an-array-5877a9d7c88b
JavaScript Tip: Conditionally Add an Item to an Array | by Chad Murobayashi | JavaScript in Plain English
July 30, 2021 - My initial thought was to use the logical AND (&&) operator as I have above. This will work, but the problem is that the “baseball” item will become false, rather than be removed. This will result in the following array. ... New JavaScript and Web Development content every day.