Operadores de comparación de JavaScript

Resumen: en este tutorial, aprenderás a usar operadores de comparación de JavaScript para comparar dos valores.

Introducción a los operadores de comparación de JavaScript

Para comparar dos valores, utiliza un operador de comparación. La siguiente tabla muestra los operadores de comparación en JavaScript:

Un operador de comparación devuelve un valor booleano que indica si la comparación es verdadera o no. Veamos el siguiente ejemplo:

let r1 = 20 > 10; // true
let r2 = 20 < 10; // false
let r3 = 10 == 10; // true

Un operador de comparación toma dos valores. Si los valores no son comparables porque son de diferente tipo, el operador de comparación los convierte en valores de tipos comparables según las reglas específicas.

Comparar números

Si los valores son números, los operadores de comparación realizan una comparación numérica. Por ejemplo:

let a = 10,
    b = 20;

console.log(a >= b);  // false
console.log(a == 10); // true

Este ejemplo es sencillo. La variable a es 10, b es 20. La expresión a >= b expresión devuelve false y la expresión a == 10 expresión devuelve true.

Comparar cadenas

Si los operandos son cadenas, JavaScript compara los códigos de caracteres numéricamente uno por uno en la cadena.

let name1 = 'alice',
    name2 = 'bob';    

let result = name1 < name2;
console.log(result); // true
console.log(name1 == 'alice'); // true

Debido a que JavaScript compara numéricamente los códigos de caracteres en las cadenas, puedes recibir un resultado inesperado, por ejemplo:

let f1 = 'apple',
    f2 = 'Banana';
let result = f2 < f1;
console.log(result); // true

En este ejemplo, f2 es menor que f1 porque la letra B tiene el código de carácter 66 mientras que la letra a tiene el código de carácter 97.

Para arreglar esto, necesitas:

• Primero, convertir las cadenas a un formato común, ya sea en minúsculas o mayúsculas
• En segundo lugar, comparar los valores convertidos

Por ejemplo:

let f1 = 'apple',
    f2 = 'Banana';

let result = f2.toLowerCase() < f1.toLowerCase();
console.log(result); // false

Ten en cuenta que toLowerCase() es un método del objeto String que convierte la cadena a minúsculas.

Comparar un número con un valor de otro tipo

Si un valor es un número y el otro no, el operador de comparación convertirá el valor no numérico en un número y los comparará numéricamente. Por ejemplo:

console.log(10 < '20'); // true

En este ejemplo, el operador de comparación convierte la cadena '20' en el número 20 y la compara con el número 10. Este es un ejemplo:

console.log(10 == '10'); // true

En este ejemplo, el operador de comparación convierte la cadena '10' en el número 10 y los compara numéricamente.

Comparar un objeto con un no-objeto

Si un valor es un objeto, se llama al método valueOf() de ese objeto para devolver el valor para la comparación. Si el objeto no tiene el método valueOf(), se llama al método toString() en su lugar. Por ejemplo:

let apple = {
  valueOf: function () {
    return 10;
  },
};

let orange = {
  toString: function () {
    return '20';
  },
};
console.log(apple > 10); // false
console.log(orange == 20); // true

En esta primera comparación, el objeto apple tiene el método valueOf() que devuelve 10. Por lo tanto, el operador de comparación usa el número 10 para comparar.

En la segunda comparación, JavaScript primero llama al método valueOf(). Sin embargo, el objeto orange no tiene el método valueOf(). Entonces, JavaScript llama al método toString() para obtener el valor devuelto de 20 para comparar.

Compara un valor booleano con otro valor

Si un valor es un valor booleano, JavaScript lo convierte en un número y compara el valor convertido con el otro valor; true se convierte en 1 y false se convierte en 0. Por ejemplo:

console.log(true > 0); // true
console.log(false < 1); // true
console.log(true > false); // true
console.log(false > true); // false
console.log(true >= true); // true
console.log(true <= true); // true
console.log(false <= false); // true
console.log(false >= false); // true

Además de las reglas anteriores, los operadores igual (==) y diferente de (!=) también tienen las siguientes reglas.

Comparar valores null y undefined

En JavaScript, null es igual a undefined. Significa que la siguiente expresión devuelve true.

console.log(null == undefined); // true

Comparar NaN con otros valores

Si cualquiera de los valores es NaN, entonces el operador igual (==) devuelve false.

console.log(NaN == 1); // false

Incluso

console.log(NaN == NaN); // false

El operador diferente dde (!=) devuelve true al comparar el NaN con otro valor:

console.log(NaN != 1); // true

Y también

console.log(NaN != NaN); // true
Estricto igual (===) y estricto distinto de (!==)

Además de los operadores de comparación anteriores, JavaScript proporciona operadores estrictamente iguales (===) y estrictamente distintos que (!==).

Los operadores de igualdad estricta y de igualdad no estricta se comportan como los operadores de igualdad y no igualdad excepto que no convierten el operando antes de la comparación. Veamos el siguiente ejemplo:

console.log("10" == 10); // true
console.log("10" === 10); // false

En la primera comparación, dado que usamos el operador de igualdad, JavaScript convierte la cadena en el número y realiza la comparación.

Sin embargo, en la segunda comparación, usamos el operador igual estricto (===), JavaScript no convierte la cadena antes de la comparación, por lo que el resultado es false.

En este tutorial, has aprendido a utilizar los operadores de comparación de JavaScript para comparar valores.