Operadores en JavaScript
En este artículo explicaremos los operadores en JavaScript.
YouTube Video
Operadores en JavaScript
Los operadores en JavaScript son símbolos o palabras clave que se utilizan para realizar cálculos o comparaciones en números y variables. Existen varios tipos de operadores, cada uno realiza diferentes operaciones. Aquí se resumen algunos de los operadores principales:.
Operadores Aritméticos
Los operadores aritméticos de JavaScript incluyen lo siguiente:.
Operador | Descripción | Ejemplo | Resultado |
---|---|---|---|
+ |
Suma | 5 + 2 |
7 |
- |
Resta | 5 - 2 |
3 |
* |
Multiplicación | 5 * 2 |
10 |
/ |
División | 5 / 2 |
2.5 |
% |
Módulo (Resto) | 5 % 2 |
1 |
++ |
Incremento (Aumentar en 1) | let x = 5; x++ |
6 |
-- |
Decremento (Disminuir en 1) | let x = 5; x-- |
4 |
1let a = 10; // Initialize variable 'a' with the value 10
2let b = 3; // Initialize variable 'b' with the value 3
3
4// Perform and display arithmetic operations between 'a' and 'b'
5console.log("Addition (a + b): ", a + b); // 13
6console.log("Subtraction (a - b): ", a - b); // 7
7console.log("Multiplication (a * b):", a * b); // 30
8console.log("Division (a / b): ", a / b); // 3.333...
9console.log("Modulus (a % b): ", a % b); // 1
10
11// Demonstrate post-increment operation on 'a'
12// Output the current value of 'a' (10), then increment
13console.log("Post-increment (a++): ", a++);
14// Display the incremented value of 'a' (11)
15console.log("Value of 'a' after increment:", a);
16
17// Demonstrate pre-increment operation on 'a'
18// Increment 'a' first (12) then output
19console.log("Pre-increment (++a): ", ++a);
20
21// Demonstrate post-decrement operation on 'a'
22// Output the current value of 'a' (12), then decrement
23console.log("Post-decrement (a--): ", a--);
24// Display the decremented value of 'a' (11)
25console.log("Value of 'a' after decrement:", a);
26
27// Demonstrate pre-decrement operation on 'a'
28// Decrement 'a' first (10) then output
29console.log("Pre-decrement (--a): ", --a);
Los operadores aritméticos realizan operaciones matemáticas básicas en números. Además de la suma y la resta, se pueden realizar operaciones como el módulo, incremento y decremento. Tenga en cuenta que el valor devuelto por el incremento o decremento varía dependiendo de si el operador está colocado antes o después del operando.
Operadores de Asignación
Los operadores de asignación de JavaScript incluyen lo siguiente:.
Operador | Descripción | Ejemplo | Resultado |
---|---|---|---|
= |
Asignación | x = 5 |
A x se le asigna el valor 5 |
+= |
Asignación de suma | x += 5 |
x = x + 5 |
-= |
Asignación de resta | x -= 5 |
x = x - 5 |
*= |
Asignación de multiplicación | x *= 5 |
x = x * 5 |
/= |
Asignación de división | x /= 5 |
x = x / 5 |
%= |
Asignación de módulo | x %= 5 |
x = x % 5 |
1let x = 10;
2
3x += 5; // x = x + 5, so x becomes 15
4console.log('After x += 5 : ', x); // 15
5
6x -= 10;
7console.log('After x -= 10 : ', x); // 5
8
9x *= 3;
10console.log('After x *= 3 : ', x); // 15
11
12x /= 3;
13console.log('After x /= 3 : ', x); // 5
14
15x %= 2;
16console.log('After x %= 2 : ', x); // 1
Los operadores de asignación se utilizan para asignar valores a las variables o actualizar los valores de las variables. Además de la asignación regular, hay operadores de asignación para operaciones aritméticas como la suma y el módulo.
Operadores de Comparación
Los operadores de comparación de JavaScript incluyen lo siguiente:.
Operador | Descripción | Ejemplo | Resultado |
---|---|---|---|
== |
Igual | 5 == "5" |
true |
=== |
Estríctamente Igual (Tanto el tipo como el valor son iguales) | 5 === "5" |
false |
!= |
No Igual | 5 != "5" |
false |
!== |
Estríctamente No Igual | 5 !== "5" |
true |
> |
Mayor que | 5 > 2 |
true |
< |
Menor que | 5 < 2 |
false |
>= |
Mayor o igual que | 5 >= 5 |
true |
<= |
Menor o igual que | 5 <= 4 |
false |
1console.log("5 == '5' evaluates to:", 5 == "5"); // true (because the values are equal)
2console.log("5 === '5' evaluates to:", 5 === "5"); // false (because the types are different)
3console.log("5 != '5' evaluates to:", 5 != "5"); // false
4console.log("5 !== '5' evaluates to:", 5 !== "5"); // true
5console.log("5 > 2 evaluates to:", 5 > 2); // true
6console.log("5 < 2 evaluates to:", 5 < 2); // false
7console.log("5 >= 5 evaluates to:", 5 >= 5); // true
8console.log("5 <= 4 evaluates to:", 5 <= 4); // false
9console.log("5 >= '5' evaluates to:", 5 >= "5"); // true
10console.log("5 <= '5' evaluates to:", 5 <= "5"); // true
- Los operadores de comparación comparan valores y devuelven true o false.
- El operador de igualdad (
==
) convierte automáticamente diferentes tipos si es necesario antes de realizar la comparación. El operador de igualdad estricta (===
) no realiza ninguna conversión de tipo durante la comparación y devuelvetrue
solo si ambos valores tienen el mismo tipo y el mismo valor. Usar el operador de igualdad estricta (===
) ayuda a prevenir errores causados por conversiones de tipo no intencionadas, por lo que se recomienda usarlo de manera preferente.
Operadores Lógicos
Los operadores lógicos de JavaScript incluyen lo siguiente:.
Operador | Descripción | Ejemplo | Resultado |
---|---|---|---|
&& |
Y (Verdadero si ambas condiciones son verdaderas) | true && false |
false |
|| |
O (Verdadero si alguna de las condiciones es verdadera) | true || false |
true |
! |
NO (Cambia verdadero a falso y falso a verdadero) | !true |
false |
1let a = true;
2let b = false;
3
4console.log("a && b evaluates to:", a && b); // false
5console.log("a || b evaluates to:", a || b); // true
6console.log("!a evaluates to:", !a); // false
Los operadores lógicos se utilizan cuando hay múltiples condiciones, para evaluar combinaciones de condiciones.
Prioridad de los operadores lógicos
En JavaScript, los operadores lógicos se evalúan generalmente en el orden en que aparece NOT
primero, seguido de AND
, y finalmente OR
.
NOT
tiene la mayor precedencia
NOT
es un operador unario y se evalúa con la mayor precedencia.
1console.log(!true || false); // false
AND
tiene precedencia sobre OR
AND
tiene mayor precedencia que OR
, por lo que se evalúa primero la parte de AND
.
1console.log(true || false && false); // true
De esta manera, la parte AND
(&&
) se evalúa primero, y su resultado se pasa a OR
(||
).
AND
y OR
realizan una evaluación de cortocircuito
AND
y OR
en JavaScript realizan una evaluación de cortocircuito. Si el resultado puede determinarse por el valor del lado izquierdo, no se evalúa la expresión del lado derecho.
1let a = false && console.log("This will not be printed");
2console.log(a); // false
3
4let b = true || console.log("This will not be printed");
5console.log(b); // true
En cualquier caso, console.log()
no será ejecutado.
Establecer precedencia explícita
Al agrupar expresiones explícitamente con paréntesis, puedes evitar malentendidos sobre la precedencia.
1console.log(true || (false && false)); // true
Diferencias entre el lenguaje natural y la interpretación en programación
Al usar operadores lógicos, es importante ser consciente de las ambigüedades del lenguaje natural. Por ejemplo, al decir 'perro blanco o gato,' podría significar 'un perro blanco o un gato de cualquier color' o 'un perro blanco o un gato blanco.'. En código, se vería así:.
1if (isWhite && isDog || isCat) {
2 console.log(' "A white dog" or "a cat of any color" ');
3}
4
5if (isWhite && (isDog || isCat)) {
6 console.log(' "A white dog" or "a white cat" ');
7}
8
9console.log(true || (false && false)); // true
Dado que el lenguaje natural contiene ambigüedades como estas, se necesita cuidado al programar o diseñar.
Operador Ternario (Operador Condicional)
JavaScript incluye un operador ternario (operador condicional).
Operador | Descripción | Ejemplo | Resultado |
---|---|---|---|
? : |
Si la condición es verdadera, se ejecuta el lado izquierdo; si es falsa, el lado derecho | condición ? si verdadero : si falso |
Resultado basado en la condición |
1let age = 20;
2let message = age >= 18 ? "Adult" : "Minor";
3console.log(message); // "Adult"
Se escribe en la forma condition ? valor si es verdadero : valor si es falso
.
Operadores a Nivel de Bits
Los operadores bit a bit de JavaScript incluyen los siguientes.
Operador | Descripción | Ejemplo | Resultado |
---|---|---|---|
& |
AND | 5 & 1 |
1 |
| |
OR | 5 | 1 |
5 |
^ |
XOR | 5 ^ 1 |
4 |
~ |
NOT | ~5 |
-6 |
<< |
Desplazamiento a la izquierda | 5 << 1 |
10 |
>> |
Desplazamiento a la derecha | 5 >> 1 |
2 |
1let x = 0x0F & 0x0C;
2console.log("0x0F & 0x0C evaluates to:", x, "(0x0C, 12)"); // 0x0C (12)
3
4x = 0x04 | 0x02;
5console.log("0x04 | 0x02 evaluates to:", x, "(0x06, 6)"); // 0x06 (6)
6
7x = 0x0F ^ 0x0C;
8console.log("0x0F ^ 0x0C evaluates to:", x, "(0x03, 3)"); // 0x03 (3)
9
10// The inverted number is represented as a negative value
11// because JavaScript numbers are stored as signed 32-bit integers.
12x = ~0x0C;
13console.log("~0x0C evaluates to:", x, "(-13, 0xF3)"); // 0xF3 (-13)
14
15x = 0x04 << 1;
16console.log("0x04 << 1 evaluates to:", x, "(0x08, 8)"); // 0x08 (8)
17x = 0x04 >> 1;
18console.log("0x04 >> 1 evaluates to:", x, "(0x02, 2)"); // 0x02 (2)
Los operadores de bits realizan cálculos en números a nivel de bits. Generalmente se utilizan para procesos de bajo nivel.
Operadores de Tipo
Los operadores de tipo de JavaScript incluyen los siguientes.
Operador | Descripción | Ejemplo | Resultado |
---|---|---|---|
typeof |
Devuelve el tipo de una variable | typeof 123 |
"number" |
instanceof |
Verifica si un objeto pertenece a una clase específica | arr instanceof Array |
true |
1console.log(typeof "Hello"); // "string"
2console.log(typeof 42); // "number"
3
4let arr = [1, 2, 3];
5console.log("arr instanceof Array : ", arr instanceof Array); // true
Los operadores de tipo se utilizan para comprobar el tipo de un valor o para convertirlo a un tipo específico.
El operador typeof
devuelve el tipo de una variable.
El operador instanceof
verifica si un objeto pertenece a una clase específica.
Resumen
- Los operadores aritméticos realizan cálculos básicos.
- Los operadores de asignación asignan o actualizan valores en las variables.
- Los operadores de comparación comparan dos valores y devuelven true o false.
- Los operadores lógicos evalúan combinaciones de condiciones.
- Los operadores ternarios permiten escribir declaraciones condicionales en una forma más corta que
if
. - Los operadores de bits realizan cálculos a nivel de bits.
- Los operadores de tipo te permiten verificar el tipo de un valor.
Puedes seguir el artículo anterior utilizando Visual Studio Code en nuestro canal de YouTube. Por favor, también revisa nuestro canal de YouTube.