La estructura de una sentencia if en JavaScript
Una sentencia if ejecuta un bloque de código solo cuando una condición se cumple. Su estructura consta de una palabra clave, una condición entre paréntesis y un bloque entre llaves:
La condición age >= 18 da como resultado true, así que el bloque se ejecuta. Si age fuera 16, la condición sería false y JavaScript saltaría el bloque por completo.
Las llaves son técnicamente opcionales cuando el bloque tiene una sola instrucción, pero úsalas siempre. Los if sin llaves son una fuente clásica de bugs: tarde o temprano alguien añade una segunda línea y se olvida de que en realidad no está dentro del bloque.
else: la rama por defecto
Combina if con else para ejecutar código distinto cuando la condición es falsa:
Se ejecuta exactamente una de las dos ramas. Nunca las dos, nunca ninguna. El else no lleva condición propia: es el comodín que recoge el caso en el que el if dio falso.
else if en JavaScript: elegir entre varias opciones
Cuando tienes más de dos casos, encadénalos con else if. JavaScript evalúa cada condición en orden y se detiene en la primera que resulte verdadera:
Solo se ejecuta una rama. En cuanto una condición coincide, el resto se ignora, aunque también fueran verdaderas. Por eso el orden importa: si pusieras score >= 60 al principio de la cadena, todo el mundo por encima de 60 se llevaría una D.
El else final es opcional, pero incluirlo deja clara tu intención: "si no coincidió nada más, haz esto".
Las condiciones pueden ser cualquier expresión
Lo que va entre paréntesis no tiene por qué ser una comparación. Puede ser cualquier expresión: JavaScript convierte el resultado a booleano (lo que se conoce como valores truthy y falsy):
Las cadenas no vacías son truthy. El 0 y las cadenas vacías son falsy, así que cuando items.length vale 0 se ejecuta la rama else. Este es el modismo clásico de JavaScript para comprobar "si hay algo ahí".
La lista completa de valores falsy es corta y vale la pena memorizarla: false, 0, -0, 0n, "", null, undefined y NaN. Todo lo demás es truthy, incluidos "0", "false", [] y {}. Los dos últimos suelen pillar desprevenido a más de uno.
Combinar condiciones en JavaScript: && y ||
Para combinar condiciones se usan && (y) y || (o):
&& exige que ambos lados sean truthy. || se conforma con que al menos uno lo sea. Los dos hacen corto-circuito: && se detiene en el primer valor falsy y || en el primer truthy. Esto es clave cuando la segunda condición tiene un efecto secundario o podría lanzar un error — user && user.name devuelve undefined sin romperse si user es null.
Envuelve la lógica mixta entre paréntesis para dejar clara la precedencia:
Sin los paréntesis, && tiene mayor precedencia que ||, y eso suele ser justo lo contrario de lo que uno espera al leerlo.
== vs === (usa ===)
A la hora de comparar igualdad dentro de un if, usa === y !== en lugar de == y !=:
== convierte tipos antes de comparar, y eso lleva a sorpresas como que "" == 0 dé true o que null == undefined también sea true. En cambio, === compara sin conversión: mismo tipo y mismo valor. Usa === por defecto. La única excepción habitual es x == null, que sirve para comprobar null y undefined de una sola pasada.
El operador ternario en JavaScript
Cuando se trata de elegir entre dos valores, el operador ternario condición ? a : b suele quedar más limpio que un if/else completo:
El ternario es una expresión: produce un valor. Esa es la diferencia clave respecto al if/else, que es una sentencia. Usa el operador ternario cuando necesites el resultado (al asignar una variable, al hacer return o al armar un string). Reserva el if/else para cuando ejecutes efectos secundarios.
Se pueden encadenar ternarios, pero la legibilidad se va al traste:
// No hagas esto:
const grade = score >= 90 ? "A" : score >= 80 ? "B" : score >= 70 ? "C" : "F";
Si vas a encadenar varias condiciones, vuelve al else if de toda la vida.
If anidado vs. else if plano en JavaScript
A veces una condición solo tiene sentido dentro de otra. Para esos casos, anidar está perfectamente bien:
Pero anidar tres o cuatro niveles ya es mala señal. Aplánalo con early returns o combinando las condiciones en una sola:
Los early returns mantienen cada rama corta y al mismo nivel de indentación. Se lee mucho mejor que una pirámide de if anidados.
Un error típico: asignación dentro del if
= asigna. === compara. Confundirlos dentro de una condición es un bug clásico de JavaScript:
status = "done" asigna "done" a status y el resultado de esa expresión es "done", que es truthy. Por eso el bloque siempre se ejecuta y, de paso, acabas de pisar el valor de la variable sin querer. Los linters detectan este tipo de fallos; el modo estricto no. Así que ojo: cuando quieras comparar, usa ===.
Lo que viene: switch
Cuando tienes que comparar un mismo valor contra varias opciones, encadenar else if tras else if se vuelve pesado y repetitivo. Para eso existe el switch en JavaScript — una sentencia pensada justo para este escenario. Eso sí, trae sus propias rarezas con break y el famoso fall-through, que es lo siguiente que vamos a ver.
Preguntas frecuentes
¿Cómo se escribe un if/else en JavaScript?
Pones la condición entre paréntesis después de if y, a continuación, el bloque entre llaves. Detrás añades else con otro bloque para el caso contrario. Por ejemplo: if (edad >= 18) { console.log('adulto'); } else { console.log('menor'); }. La condición puede ser cualquier expresión: JavaScript se encarga de convertirla a booleano.
¿Qué diferencia hay entre else if y un if anidado?
Con else if encadenas condiciones y solo se ejecuta una rama: JavaScript las evalúa en orden y se detiene en la primera que se cumple. Un if anidado mete un if dentro de otro, normalmente para comprobar una segunda condición solo cuando la primera fue verdadera. En la práctica, una cadena de else if plana casi siempre se lee mejor que varios if anidados.
¿Cuándo conviene usar el operador ternario en lugar de if/else?
El ternario condición ? a : b es ideal cuando eliges entre dos valores dentro de una expresión: al asignar una variable, devolver algo desde una función o construir un string. Quédate con if/else cuando cada rama ejecute instrucciones con efectos secundarios o cuando el código sea algo más que una expresión corta. Encadenar ternarios se vuelve ilegible muy rápido.
¿Por qué if (0) se comporta igual que if (false) en JavaScript?
Porque se comporta igual: ambos saltan el bloque. JavaScript convierte la condición a booleano, y 0, '', null, undefined, NaN y false son todos falsy. La trampa está en que '0' (un string no vacío) y [] (un array vacío) son truthy, algo que suele pillar desprevenidos a quienes vienen de otros lenguajes.
