Ternary operator in Javascript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of nested ternary operator

What is the output of the following JavaScript code?

Javascript

const x = 5;
const y = 10;
const result = x > 3 ? (y < 15 ? 'A' : 'B') : 'C';
console.log(result);

A "B"

B "A"

C "C"

D undefined

💡 Hint

Check the conditions step by step starting from the outer ternary.

x is 5 which is greater than 3, so the outer condition is true. Then y is 10 which is less than 15, so the inner condition is true. Therefore, the result is 'A'.

❓ Predict Output

intermediate

Ternary operator with falsy values

What will be logged to the console?

Javascript

const value = 0;
const output = value ? 'Yes' : 'No';
console.log(output);

A "No"

B undefined

C 0

D "Yes"

💡 Hint

Remember how JavaScript treats 0 in boolean context.

0 is a falsy value in JavaScript, so the ternary condition evaluates to false and the output is 'No'.

❓ Predict Output

advanced

Ternary operator with side effects

What is the output of this code?

Javascript

let count = 0;
const result = count === 0 ? (count += 5) : (count += 10);
console.log(result, count);

A 5 0

B 10 10

C 0 5

D 5 5

💡 Hint

Check how the ternary operator changes the count variable.

count starts at 0, so the condition is true. The expression (count += 5) adds 5 to count and returns 5. Both result and count become 5.

❓ Predict Output

advanced

Ternary operator with different types

What will this code print?

Javascript

const a = true;
const b = false;
const output = a ? (b ? 1 : 'two') : 3;
console.log(typeof output, output);

A "string two"

B "number 1"

C "number 3"

D "boolean true"

💡 Hint

Evaluate the nested ternary carefully and check the type of the final value.

a is true, so we check b. b is false, so the inner ternary returns 'two' which is a string. The typeof output is 'string'.

🧠 Conceptual

expert

Understanding ternary operator evaluation order

Consider the code below. What is the value of variable result after execution?

Javascript

let x = 2;
const result = x > 1 ? x++ : --x;

A 1

B 3

C 2

D SyntaxError

💡 Hint

Remember that x++ returns the value before incrementing.

x is 2 which is greater than 1, so the condition is true. The expression x++ returns 2 (the current value) and then increments x to 3. So result is 2, but x becomes 3.