FAQ: Advanced JSX - JSX Conditionals: The Ternary Operator

#1

This community-built FAQ covers the “JSX Conditionals: The Ternary Operator” exercise from the lesson “Advanced JSX”.

Paths and Courses
This exercise can be found in the following Codecademy content:

Web Development

Learn ReactJS: Part I

FAQs on the exercise JSX Conditionals: The Ternary Operator

Join the Discussion. Help a fellow learner on their journey.

Ask or answer a question about this exercise by clicking reply (reply) below!

Agree with a comment or answer? Like (like) to up-vote the contribution!

Need broader help or resources? Head here.

Looking for motivation to keep learning? Join our wider discussions.

Learn more about how to use this guide.

Found a bug? Report it!

Have a question about your account or billing? Reach out to our customer support team!

None of the above? Find out where to ask other questions here!

#2

I thought you couldn’t use conditionals in JSX statements? Isn’t the ternary operator a JS conditional?

#3

Why in the exercise you have to enclose the ternary operator between brackets? Its not that its an array, right? An even more in the previous exercise the img is found by using “pics.kitty”, however with the ternary operator the final result would be “pics[kitty]”. Can someone please explain this?

1 Like
#4

Same question. Why brackets?

#5

Hello dude. i have a question in the Ternary Operator.

const img = <img src={pics[coinToss() === ‘heads’ ? ‘kitty’ : ‘doggy’]} />;

in example above, why cointToss() must be wrapper by side brackets ?

#6

It’s not coinToss but the entire expression, as it will result in keyword. It’s that keyword that will end up in the square brackets to lead us to pics[keyword].

#7

Regarding the use of [ ] in this exercise, it’s easier to understand the use of the ternary like this:

const img = <img src={coinToss() === 'heads' ? pics.kitty : pics.doggy} />;

The [ ] is just addressing the pics object differently, by having it resolve to either pics['kitty'] or pics['doggy']

1 Like