¿Cómo funcionan los operadores en JavaScript?

Última actualización: 01 - 11 - 2023

¿Qué son los operadores de JavaScript?

Los operadores de JavaScript (JavaScript Operators en inglés) sirven para manipular, comparar, asignar o controlar el flujo de datos de nuestro programa. En este artículo te voy a explicar el funcionamiento de los operadores de JavaScript más utilizados.

Operador de asignación

Es el operador que se utiliza para asignar un valor a una variable utilizando el símbolo de igualdad (=). Cabe recordar de que a pesar que se use este símbolo, la asignación NO es una igualdad.

Aquí tienes un ejemplo de una asignación de variables:

let operadoresDeJavascript =  ["Operador de asignación"];

En este caso se está asignando un arreglo a la variable operadoresDeJavascript con un solo índice ("Operador de asignación"). A medida que avance el artículo se le hará un push a ese arreglo. 😆

(Push es un método para agregar elementos a un array. Dale click a este enlace si todavía no has visto métodos para los arrays.)

Los arreglos son un tipo de dato de JavaScript que sirve para almacenar varios datos en una misma variable, estos tienen diferentes métodos para manipularlos (como el push). Más adelante haré un artículo sobre los arreglos en detalle.

Operadores Aritméticos

Son el tipo de operadores que se utilizan para realizar operaciones matemáticas. Entre estos tenemos:

Operador de adición o suma

Es el operador que se encarga de SUMAR datos dentro del programa.

El énfasis en sumar es porque este operador se usa también para concatenar datos. Lo veremos más adelante.

let numero1 = 333;
let numero2 = 333;

let theNumberOfTheBeast = numero1 + numero2;🤘

Operador de sustracción o resta

Es el operador que se encarga de restar datos numéricos.

let a = 10;
let b = 9;

let resultado = a - b;

El símbolo de resta (-) también se usa para asignar un valor negativo al dato numérico.

Operador de multiplicación

Es el operador que se encarga de multiplicar valores numéricos. Viene representado por el símbolo de asterisco (*) y no por una X.

let orden = 33;

let ordenDeEjecucion = orden*2;💀

Operador de división

Es el operador que se encarga de dividir valores numéricos. Se utiliza el slash (/) para realizarlo.

let a = 10;
let b = 5;

let resultado = a / b;

Operador de modulo o de residuo

Este operador divide los datos proporcionados y devuelve el residuo de esa división. Se ejecuta con el símbolo de porcentaje (%).

let a = 10;
let b = 3;

let residuo = a % b;// El resultado es 1

Operador de potenciación

Este operador se usa para llevar un dato numérico a una potencia designada. Este se ejecuta utilizando un doble asterisco (**).

let base = 5;
let exponente = 4;

let potencia = base ** exponente;// Matemáticas... 🙄

Los operadores aritméticos siguen las mismas reglas de la ley de jerarquía de operaciones.

operadoresDeJavascript.push("Operadores Aritméticos");

Operadores de incremento y descenso

Este es otro operador que maneja Javascript que es muy utilizado para los bucles for o while. Por ejemplo:

for (let i = 10; i <= 0; i++) {
  console.log(i);
  // Se imprimirán los números del 1 al 10 de forma ascendente
}

Si te fijas, la variable i tiene en su lado derecho dos símbolos de suma (++), ese es el operador de incremento.

También hay otro operador dentro de este ejemplo (<=), ese es un operador de comparación, hablaré de ellos en el siguiente punto.

// Los operadores de incremento ++ son el equivalente a  i = i + 1;

Existen los casos en donde vas a querer disminuir la cantidad de ese valor numérico.

for (let i = 10; i >= 0; i--) {
  console.log(i);
  // Se imprimirán los números del 10 al 1
}

operadoresDeJavascript.push("Operadores de incremento y descenso");

Operadores de comparación

Estos operadores son los que evalúan dos o más datos para que el flujo de un algoritmo tome un paso definido. Son muy utilizados en los controles de flujo como if else o en bucles for como en el ejemplo anterior.

Entre los comparadores tenemos los siguientes:

//Mayor que
edadTrunks > edadGoten

//Menor que
SSJ1 < SSJ2

//Mayor o igual a
kiDeVegito >= kiDeGogeta

//Menor o igual a
kiDeYamcha <= 0

Con los operadores de comparación de JavaScript sucede algo curioso y es que este lenguaje de programación existe el triple igual (===).

Ya sabemos que un solo igual (=) asigna un valor, el doble igual (==) compara si ambos valores son "iguales" y el triple igual (===) hace una comparación estricta, este último evalúa también el tipo de dato que tiene la variable.

//Operador de asignación con =
let cadenaDeTexto = "Soy una cadena de texto xD";

//Operador de comparación con ==
let x = 9;
let y = "9";

console.log(x == y);// Imprimirá  true

// En el caso de evaluar de esta forma dos strings hay que recordar que el lenguaje es case sensitive

//Operador de comparación estricta con ===
console.log(x === y);// Imprimirá  false

Ahora están los operadores de comparación desiguales:

//No es igual
Ethereum != Bitcoin

// Estrictamente Jodídamente desigual
Petro !== Bitcoin

Ambos operadores de desigualdad funcionan de la misma manera que los operadores de igualdad. La desigualdad (!=) será true si ambos datos no son iguales; la desigualdad estricta (!==) será true si los datos son los mismos y no comparten el mismo tipo de dato.

operadoresDeJavascript.push("Operadores de comparación");

Operadores de asignación aritmética

Son una forma abreviada de asignar una operación matemática a un dato numérico.

Tenemos la forma conocida

let numero1 = 10;

numero1 = numero1 + 2;// 12

Y en su forma con una asignación aritmética

let numero1 = 10;

numero1 += 2;// 12

Este operador también puede ser utilizado para concatenar dos strings.

let prenombre = "Darth ";
let nombre = "Vader";

let newSith = prenombre += nombre;// Darth Vader

Los operadores de asignación aritmética también aplican para las demás operaciones matemáticas.

let numero1 = 10;

numero1 += 2;// 12
numero1 -= 2;// 8... imagina que no hay reasignación de variables aquí para que den estos resultados 😅
numero1 *= 2;// 20
numero1 /= 2;// 5
numero1 %= 2;// 0

operadoresDeJavascript.push("Operadores de asignación aritmética");

Operador de concatenación

Es el mismo operador que se utiliza para sumar (+). En este caso se usa para unir dos o más cadenas de texto y variables.

let pilotoLloron = "Shinji Ikari";

let frase = "Métete en el maldito robot " + pilotoLloron;

Este operador de Javascript también es usado con comas (,).

let pilotoLloron = "Shinji Ikari";

let frase = "Métete en el maldito robot ", pilotoLloron;

Si bien es útil para imprimir datos cortos, también existen los template strings para este tipo de tareas.

let pilotoLloron = "Shinji Ikari";

let frase = `Métete en el maldito robot ${pilotoLloron}`;

Los template strings son utilizados con backtics (``) o comillas invertidas y para colocar las variables a concatenar se usa ${ }.

operadoresDeJavascript.push("Operador de concatenación");

Operadores lógicos

Este tipo de operador funciona con valores booleanos. Un algoritmo puede tomar una ruta dependiendo de cómo esté establecido el operador lógico. Los flujos de control if suelen ejecutar su código interno si la condición es verdadera (true) a no ser que se indique lo contrario.

⚠Disclaimer⚠

Hay veces que para explicar un tema hay que adelantar un poco sobre la materia, en este artículo se ha tocado un poco sobre flujos de control pero en un futuro hablaré en detalle sobre ellos. 😁

Existen tres tipos de operadores lógicos:

Operador lógico OR (||)

Se expresa con el double pipe. Este operador evalúa diferentes condiciones dentro de una sentencia y tomará la primera que sea verdadera (true) de izquierda a derecha.

let mensaje = "He elegido que 10 es menor a 20.";

if (10 < 5 || 10 < 20) {
  console.log(mensaje);
}

Si ambas o todas las condiciones son verdaderas va a tomar la primera que se encuentre dentro de la sentencia.

Si todas las condiciones fueran false se iría por un else en caso de tenerlo.

Operador lógico AND (&&)

Se expresa con el doble ampersand. Este operador evalúa que ambas condiciones dentro de una sentencia se cumplan.

let mensaje = "Probando el flujo con el operador AND.";

if (10 < 5 && 10 < 20){
  console.log(mensaje);
}

En este caso el código no se ejecuta porque solo una condición se está cumpliendo (10 < 20) y no hay un else que ejecute otra condición.

let mensaje = "Probando el flujo con el operador AND.";

if (10 > 5 && 10 < 20){
  console.log(mensaje);
}

Para este ejemplo ambas condiciones se están cumpliendo y el código se ejecuta.

Si queremos entenderlo mejor podemos verlo de la siguiente forma:

Operador lógico not (!)

Este operador invierte el tipo de valor booleano que se le asigne. Usa el símbolo de exclamación (!) al principio del dato para cambiar su valor booleano.

let verdadero_a_falso = !true;
let falso_a_verdadero = !false;

operadoresDeJavascript.push("Operadores lógicos");

Estos son los operadores de Javascript más comunes, te encontrarás con ejemplos un poco más complejos en la red pero una vez los entiendas podrás comprender mejor el flujo de un algoritmo.

Y solo para recordar. Voy a dejar un arreglo de los que se mostraron en este artículo. Esos push no estaban ahí de gratis. 😆

let operadoresDeJavascript =  [
  "Operador de asignación",
  "Operadores aritméticos",
  "Operadores de incremento y descenso",
  "Operadores de comparación",
  "Operadores de asignación aritmética",
  "Operadores de concatenación",
  "Operadores lógicos"
];
Volver