¿Es buena idea usar “​&&”​ como Conditional Rendering en React?

Nancy Zitle Juárez
2 min readDec 3, 2022
Fuente: https://learn.codevolution.dev

Leí este artículo donde menciona que no es buena idea utilizar “&&” al momento de validar que vamos a pintar en nuestra UI, lo que explica es que este tipo de validaciones son conocidos como “short-circuit evaluation” en JS y básicamente valida que el primer valor sea verdadero para realizar una acción.

Si bien esto funciona con valores booleanos que sucede con los valores truthy y falsy en JS, por ejemplo el número 0 es considerado como ‘falso’ pero si usamos el logical “&&” operator para validar podremos observar que este se pinta en nuestra UI.

Figura 1, fuente: https://codepen.io/gaearon/pen/ozJddz?editors=0011

Yo lo soluciono agregando doble !!

Figura 2, fuente: https://codepen.io/gaearon/pen/ozJddz?editors=0011

Y por este motivo se sugiere usar el operador ternario y evitarnos posibles errores en nuestra UI.

condition ? <ConditionalComponent> : null;

Desde mi POV considero que no es malo usar el logical “&&” operator, pero si deberíamos de considerar el posible error en UI que nos podría ocasionar y resolverlo, pero dime, ¿qué piensas sobre esto?.

Gracias por leerme, 🫂 .

--

--

Nancy Zitle Juárez

Hola, soy Nancy, una apasionada lectora y escritora. Me encanta compartir información sobre tecnología y diversos temas.¡Espero que disfrutes de mis contenidos!