JS: Operadores lógicos

Los operadores lógicos se utilizan para combinar o invertir expresiones booleanas, que siempre se evalúan como true o false. En JavaScript hay tres operadores lógicos principales: && (AND), || (OR) y ! (NOT). Son esenciales para construir condiciones complejas y controlar el flujo del programa.

Los operadores lógicos no se limitan a trabajar con valores booleanos (true o false). Si los operandos son de otro tipo (como number o string), el lenguaje evalúa su “valor lógico”, es decir, si son «falsy» o «truthy».

Un valor falsy es aquel que se considera falso al convertirlo a booleano. Se trata de los siguientes valores: false, 0, '' (cadena vacía), null, undefined y NaN. En consecuencia, todos los demás se consideran truthy, es decir, los que se consideran verdaderos después de convertidos a booleanos. Esto sería: cualquier número distinto de cero, cualquier cadena no vacía, etc.

El operador AND

El operador AND se representa con el doble signo «ampersand» (&&) y evalúa las expresiones secuencialmente, siguiendo el orden de izquierda a derecha. Desde una perspectiva lógica (booleana), el resultado de la operación es verdadero solo si todos los operandos son considerados verdaderos.

Pero el mecanismo interno de JavaScript es más complejo y utiliza la evaluación en «cortocircuito» (short-circuiting). En realidad, el operador && busca el primer valor falsy. Si el primer operando que se evalúa es considerado falsy, la evaluación se detiene y el operador devuelve inmediatamente ese valor falsy.

En cambio, si el operando actual es truthy, la evaluación continúa con el siguiente operando, y así sucesivamente hasta el final. Si todos los operandos resultan ser truthy, el operador devuelve el valor del último operando.

Tomemos como ejemplo la expresión x && y. Si la variable x tiene un valor falsy, devolverá el valor de x. Si es truthy, evaluará el valor del siguiente operando (y). Al tratarse del último operando, el operador devolverá el valor de y. Esta regla se aplica a todos los tipos de datos (number, string, etc).

Como regla general, hay que tener claro que el operador && siempre devuelve el valor del último operando evaluado.

Veamos algunos ejemplos de operandos de tipo booleano:

true && true;   // true (ambos son truthy)
true && false;  // false (el segundo es falsy)
false && true;  // false (el primero es falsy)
false && false; // false (ambos son falsy)

Algunos ejemplos con operandos numéricos:

0 && 10; // 0 (el primero es falsy)
10 && 4; // 4 (ambos son truthy)
25 && 0; // 0 (el segundo es falsy)

Ejemplos con cadenas de texto:

'' && 'A';  // vacío (el primero es falsy)
'A' && 'B'; // B (ambos son truthy)
'C' && '';  // vacío (el segundo es falsy)

Ejemplos variados:

0 && "Hola";   // 0 (el primero es falsy)
"Hola" && 123; // 123 (ambos son truthy)
null && true;  // null (el primero es falsy)

El operador OR

El operador OR se representa con el doble símbolo de barra vertical (||). Al igual que AND, también evalúa las expresiones de izquierda a derecha. Pero hay una diferencia clara: en este caso, el resultado de la operación es verdadero si al menos uno de los operandos es considerado verdadero.

Su funcionamiento interno es el siguiente: el operador || busca el primer valor truthy. Si el primer operando que se evalúa es considerado verdadero (truthy), la evaluación se detiene y el operador devuelve ese valor truthy.

En cambio, si el operando actual es falsy, la evaluación continúa hasta el siguiente operando, y así sucesivamente hasta el final. Si todos los operandos resultan ser falsy, el operador devolverá el valor del último operando.

Imaginemos el siguiente ejemplo: x || y. Si la variable x tiene un valor truthy, el operador devolverá su valor. Si es falsy, evaluará el valor del siguiente operando (y). En este caso, se trata del último operando y devolverá el valor de y.

Resumiendo lo importante, no hay que olvidar que el operador || siempre devuelve el primer valor truthy que encuentra; y si todos los operandos son falsy, entonces devuelve el último operando evaluado.

Ejemplos usando operandos booleanos:

true || true;   // true (el primero es truthy)
true || false;  // true (el primero es truthy)
false || true;  // true (el segundo es truthy)
false || false; // false (ambos son falsy)

Ejemplos usando operandos numéricos:

0 || 10; // 10 (el segundo es truthy)
10 || 4; // 10 (el primero es truthy)
25 || 0; // 25 (el primero es truthy)
0 || 0;  // 0 (ambos son falsy)

Ejemplos con cadenas de texto:

'' || 'A';  // 'A' (el segundo es truthy)
'A' || 'B'; // 'A' (el primero es truthy)
'C' || '';  // 'C' (el primero es truthy)
'' || '';   // '' (ambos son falsy)

Ejemplos variados:

0 || "Hola";    // "Hola" (el segundo es truthy)
"Hola" || 123;  // "Hola" (el primero es truthy)
null || true;   // true (el segundo es truthy)
undefined || 0; // 0 (ambos son falsy)

El operador NOT

El operador NOT está representado con el signo de exclamación (!) y se aplica a un único operando. Por tanto, es un operador unario. Su función es invertir el valor lógico (booleano) del operando. Si el operando es truthy, el resultado será false (falso), y si es falsy, el resultado será true (verdadero).

Desde una perspectiva lógica, podemos decir que este operador convierte cualquier valor a su equivalente booleano opuesto. Para ello, primero realiza una conversión implícita (coerción) al tipo de dato boolean (booleano). Por esta razón, el operador NOT siempre devuelve un valor estrictamente booleano.

Como regla general, hay que tener en cuenta que el operador ! niega el valor lógico del operando después de convertirlo a booleano.

Veamos algunos ejemplos con valores booleanos:

!true;  // false
!false; // true

Ejemplos usando operandos numéricos:

!0;   // true (0 es falsy)
!123; // false (123 es truthy)

Ejemplos con cadenas de texto:

!'';     // true (cadena vacía es falsy)
!'Hola'; // false (cadena de texto es truthy)

Ejemplos variados:

!null;      // true (null es falsy)
!undefined; // true (undefined es falsy)
!NaN;       // true (NaN es falsy)
!{};        // false (objeto es truthy)
![];        // false (array vacío es truthy)