JSX Conditionals: &&


{!judgmental && <li>Nacho Cheez Straight Out The Jar</li>}

I am just wondering why you have to use ! in front of judgmental?
It seems to be producing same result with or without the !

As judgmental will be randomly generated as true or false, using ! will just flip the result.

Is there a concept I am missing here?


If judgemental is false then render <li>Nacho Cheez Straight Out The Jar</li>

Have you done console.log with judgemental to see what happens when the random assignment produces true? Does the

  • get generated?
  • 1 Like

    I tried to console.log without “!” for 10 times, below is the console result
    console.log( judgmental && "<li>Nacho Cheez Straight Out The Jar</li>");

    Then I tried to conosle.log with “!” for 10 times, it seems that the result is the same:
    console.log( !judgmental && "<li>Nacho Cheez Straight Out The Jar</li>");

    I am sorry I still don’t understand the difference… :rofl: :rofl: