Ternary Operator

A shorthand operator that returns one value if a condition is true and another if false, without needing if/else.

Part of: JavaScript Coding without HTML and CSS — Module 17

Understanding Ternary Operator in JavaScript

What it does: This is exactly the pattern the ternary operator follows. The colon divides the value used for true from the value for false. The ternary operator always pairs ? with a matching :. It condenses a simple if/else into a single expression. The condition must be followed by ?, not =. The whole ternary expression evaluates to a single value. The ? comes directly after the condition, no semicolon needed. Only ? introduces the true/false values in a ternary.

Common mistakes: Ternary condition uses ?, not =, before the values. Ternary needs ?, not -, after the condition.

Class: _____________________ · Name: _____________________ · Date: _________

Free printable worksheet with full answer key — or add this module to a class and your students practise it interactively.

🖨 Print worksheet + answer key Add Ternary Operator to a class →

This module's key terms are also in a printable crossword (Modules 11–25) and word search (Modules 1–29).

Take this worksheet further — free with Cloodit

Each concept is reinforced from every angle — learned, then applied, then tested.

Learning

Duo

Does the ternary operator use ? and : together?

YesNo

Matches

let x = a = "yes" : "no";

↓

Wrong - use ?, not =, after the condition

Applying

Meanings

Term

Meaning

A shorthand operator that returns one value if a condition is true and another if false, without needing if/else.

Practice

let age = 12;

Testing

Gaps

let status = age >= 18 "adult" : "minor";

Check Answer

Spots

1let x = ok = "a" : "b";

2console.log(x);

Cloodit turns curriculum-aligned coding content into journeys students work through one biome at a time.

Students earn collectable badges

Over 100 of them, across seven natural biomes.

Study Buddy

Students build a real study resource

Turns their work into revision material ready for Flash Cards and Exam study.

Diamond Dash — one of Cloodit's live, competitive Sprint games

Students lock in with Sprints

Live, competitive practice for the start of the lesson or a teacher-led lesson finisher.

A Cloodit certificate of achievement, ready to personalise and print

Custom printable certificates

Honour your top performers, or encourage a student who's trying hard — ready to print in seconds.

Add to class →

Quick Questions

1. Does the ternary operator use ? and : together?

A. Yes ✓

B. No

The ternary operator always pairs ? with a matching :.

2. Is the ternary operator a shorthand for if/else?

A. No

B. Yes ✓

It condenses a simple if/else into a single expression.

3. Does = replace ? in a correct ternary expression?

A. Yes

B. No ✓

The condition must be followed by ?, not =.

4. Can a ternary expression's result be stored in a variable?

A. Yes ✓

B. No

The whole ternary expression evaluates to a single value.

5. Does the condition need a semicolon before the ?

A. No ✓

B. Yes

The ? comes directly after the condition, no semicolon needed.

Match the Pairs

age >= 18 ? "adult" : "minor" → Returns "adult" if age is 18 or more, otherwise "minor"

score > 50 ? "win" : "lose" → Returns "win" if score is over 50, otherwise "lose"

A shorthand way of writing an if/else statement → condition ? valueIfTrue : valueIfFalse

Separates the true and false results in a ternary → :

let x = a = "yes" : "no"; → Wrong - use ?, not =, after the condition

let y = a ? "yes" - "no"; → Wrong - use :, not -, between the two values

Key Term

?:

A shorthand operator that returns one value if a condition is true and another if false, without needing if/else.

Fill in the Blanks

1. let status = age >= 18 ? "adult" : "minor";

Hint: Type the symbol that starts the ternary operator.

2. let result = score > 50 ? "win" : "lose";

Hint: Type the symbol that separates the two ternary values.

3. let label = isReady ? "Go" : "Wait";

Hint: Type the symbol that starts the ternary operator.

4. let output = temp > 30 ? "hot" : "cool";

Hint: Type the symbol that separates the two ternary values.

5. let grade = pass ? "Pass" : "Fail";

Hint: Type the symbol that starts the ternary operator.

Spot the Error

Question 1

A let x = ok = "a" : "b";

B console.log(x);

C let y = 5;

Line A — Ternary condition uses ?, not =, before the values.

Question 2

A let a = 5;

B let b = x > 3 - "hi" : "lo";

C console.log(b);

Line B — Ternary needs ?, not -, after the condition.

Question 3

A let n = 10;

B let z = 1;

C let lab = n==10 ? "a" ; "b";

D console.log(lab);

Line C — Ternary needs :, not ;, between the two values.

Question 4

A let age = 20;

B let t;

C console.log(t);

D t = age>=18 ? "a" "b";

Line D — Missing the colon : between the two ternary values.

Question 5

A let s = 75;

B let r;

C console.log(r);

D let ok2 = true;

E r = s>=50 && "p" : "f";

Line E — Ternary condition uses ?, not &&, before the values.

Student with a class code? Join your class →