Operadores de JavaScript

Tabla de contenido

El Operador de suma + suma números:

El Operador de asignación = asigna un valor a una variable.

Asignación de JavaScript

El Operador de Asignación (=) asigna un valor a una variable:

Ejemplos de tareas

let x = 10;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The = Operator</h2>

<p id="demo"></p>

<script>
let x = 10;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

// Assign the value 5 to x
let x = 5;
// Assign the value 2 to y
let y = 2;
// Assign the value x + y to z:
let z = x + y;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The Assignment (=) Operator</h2>

<p id="demo"></p>

<script>
// Assign the value 5 to x
let x = 5;
// Assign the value 2 to y
let y = 2;
// Assign the value x + y to z
let z = x + y;
// Display z
document.getElementById("demo").innerHTML = "The sum of x + y is: " + z;
</script>

</body>
</html>

Adición de JavaScript

El Operador de suma (+) suma números:

Añadiendo

let x = 5;
let y = 2;
let z = x + y;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The + Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
let y = 2;
let z = x + y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Multiplicación de JavaScript

El Operador de multiplicación (*) multiplica números:

multiplicando

let x = 5;
let y = 2;
let z = x * y;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The * Operator</h2>

<p id="demo"></p>

<script>
let x = 5;
let y = 2;
let z = x * y;
document.getElementById("demo").innerHTML = z;
</script>

</body>
</html>

Tipos de operadores de JavaScript

Existen diferentes tipos de operadores de JavaScript:

Operadores aritméticos
Operadores de Asignación
Operadores de comparación
Operadores de cadena
Operadores logicos
Operadores bit a bit
Operadores ternarios
Operadores de tipo

Operadores aritméticos de JavaScript

Los Operadores Aritméticos se utilizan para realizar operaciones aritméticas con números:

Ejemplo de operadores aritméticos

let a = 3;
let x = (100 + 50) * a;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Arithmetic Operations</h2>
<p>A typical arithmetic operation takes two numbers (or expressions) and produces a new number.</p>

<p id="demo"></p>

<script>
let a = 3;
let x = (100 + 50) * a;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

+: Suma
-: Sustracción
*: Multiplicación
**: Exponenciación (ES2016)
/: División
%: Módulo (resto de división)
++: Incremento
--: Decremento

Nota

Los operadores aritméticos se describen detalladamente en Capítulo JS Aritmética.

Operadores de asignación de JavaScript

Los operadores de asignación asignan valores a variables de JavaScript.

El Operador de asignación de suma (+=) agrega un valor a una variable.

Asignación

let x = 10;
x += 5;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>The += Operator</h2>

<p id="demo"></p>

<script>
var x = 10;
x += 5;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Operator	Example	Same As
=	x = y	x = y
+=	x += y	x = x + y
-=	x -= y	x = x - y
*=	x *= y	x = x * y
/=	x /= y	x = x / y
%=	x %= y	x = x % y
**=	x **= y	x = x ** y

Nota

Los operadores de asignación se describen completamente en Capítulo Asignación JS.

Operadores de comparación de JavaScript

==: igual a
===: igual valor e igual tipo
!=: no es igual
!==: valor no igual o tipo no igual
>: mas grande que
<: menos que
>=: Mayor qué o igual a
<=: Menos que o igual a
?: operador ternario

Nota

Los operadores de comparación se describen completamente en Capítulo Comparaciones JS.

Comparación de cadenas de JavaScript

Todos los operadores de comparación anteriores también se pueden utilizar en cadenas:

Ejemplo

let text1 = "A";
let text2 = "B";
let result = text1 < text2;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>

<p>All conditional operators can be used on both numbers and strings.</p>

<p id="demo"></p>

<script>
let text1 = "A";
let text2 = "B";
let result = text1 < text2;
document.getElementById("demo").innerHTML = "Is A less than B? " + result;
</script>

</body>
</html>

Tenga en cuenta que las cadenas se comparan alfabéticamente:

Ejemplo

let text1 = "20";
let text2 = "5";
let result = text1 < text2;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript String Operators</h1>
<p>Note that strings are compared alphabetically:</p>

<p id="demo"></p>

<script>
let text1 = "20";
let text2 = "5";
let result = text1 < text2;
document.getElementById("demo").innerHTML = "Is 20 less than 5? " + result;
</script>

</body>
</html>

Adición de cadenas de JavaScript

El + también se puede utilizar para agregar (concatenar) cadenas:

Ejemplo

let text1 = "John";
let text2 = "Doe";
let text3 = text1 + " " + text2;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>
<h2>The + Operator</h2>
<p>The + operator concatenates (adds) strings.</p>

<p id="demo"></p>

<script>
let text1 = "John";
let text2 = "Doe";
let text3 = text1 + " " + text2;
document.getElementById("demo").innerHTML = text3;
</script>

</body>
</html>

El operador de asignación += también se puede utilizar para agregar (concatenar) cadenas:

Ejemplo

let text1 = "What a very ";
text1 += "nice day";

El resultado de text1 será:

What a very nice day

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>
<h2>The += Operator</h2>
<p>The assignment operator += can concatenate strings.</p>

<p id="demo"></p>

<script>
let text1 = "What a very ";
text1 += "nice day";
document.getElementById("demo").innerHTML = text1;
</script>

</body>
</html>

Nota

Cuando se usa en cadenas, el operador + se llama operador de concatenación.

Agregar cadenas y números

Sumar dos números devolverá la suma, pero agregar un número y una cadena devolverá una cadena:

Ejemplo

let x = 5 + 5;
let y = "5" + 5;
let z = "Hello" + 5;

El resultado de x, y y z será:


10

55

Hello5

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Operators</h1>
<h2>The + Operator</h2>
<p>Adding a number and a string, returns a string.</p>

<p id="demo"></p>

<script>
let x = 5 + 5;
let y = "5" + 5;
let z = "Hello" + 5;
document.getElementById("demo").innerHTML =
x + "<br>" + y + "<br>" + z;
</script>

</body>
</html>

Nota

Si sumas un número y una cadena, ¡el resultado será una cadena!

Operadores lógicos de JavaScript

&&: lógico y
||: lógico o
!: lógico no

Nota

Los operadores lógicos se describen completamente en Capítulo Comparaciones JS.

Operadores de tipo JavaScript

typeof: Devuelve el tipo de una variable.
instanceof: Devuelve verdadero si un objeto es una instancia de un tipo de objeto

Nota

Los operadores de tipo se describen detalladamente en el capítulo Conversión de tipo JS.

Operadores bit a bit de JavaScript

Los operadores de bits trabajan con números de 32 bits.

Cualquier operando numérico en la operación se convierte en un número de 32 bits. El resultado se vuelve a convertir en un número de JavaScript.

Operator	Description	Example	Same as	Result	Decimal
&	AND	5 & 1	0101 & 0001	0001	1
\|	OR	5 \| 1	0101 \| 0001	0101	5
~	NOT	~ 5	~0101	1010	10
^	XOR	5 ^ 1	0101 ^ 0001	0100	4
<<	left shift	5 << 1	0101 << 1	1010	10
>>	right shift	5 >> 1	0101 >> 1	0010	2
>>>	unsigned right shift	5 >>> 1	0101 >>> 1	0010	2

Los ejemplos anteriores utilizan ejemplos sin signo de 4 bits. Pero JavaScript usa números con signo de 32 bits.
Debido a esto, en JavaScript, ~ 5 no devolverá 10. Devolverá -6.
~000000000000000000000000000000101 devolverá 111111111111111111111111111111010

Los operadores bit a bit se describen completamente en JS. Capítulo bit a bit.