Javascript tip — Use ternaries rather than && in JSX

When JavaScript evaluates 0 && anything the result will always be 0 because 0 is falsy, so it doesn’t evaluate the right side of the &&

console.log(0 && true) // 0 - falsy, right side not evaluated
console.log(0 && false) // 0 - falsy, right side not evaluated
console.log(false && true) // falsy, right side not evaluated
console.log(false && false) // falsy, right side not evaluated

Look at these too:

console.log(1 && true) // true, right side evaluated
console.log(1 && false) // false, right side evaluated
console.log(1 && false) // false, right side evaluated
console.log(1 && false) // false, right side evaluated

The solution? Use a ternary to be explicit.

Read more: https://blog.nordible.com/Javascript-Tip-Use-Ternary-Instead-Of-And-And/