Aritmética de JavaScript

Tabla de contenido

    Mostrar tabla de contenidos

Operadores aritméticos de JavaScript

Los operadores aritméticos realizan aritmética con números (literales o variables).

+

Suma

-

Sustracción

*

Multiplicación

**

Exponenciación (ES2016)

/

División

%

Módulo (resto)

++

Incremento

--

Decremento

Operaciones aritmeticas

Una operación aritmética típica opera con dos números.

Los dos números pueden ser literales:

Ejemplo

let x = 100 + 50;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Arithmetic</h2>
<p>A typical arithmetic operation takes two numbers and produces a new number.</p>

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

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

</body>
</html>

o variables:

Ejemplo

let x = a + b;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

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

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

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

</body>
</html>

o expresiones:

Ejemplo

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>

Operadores y operandos

Los números (en una operación aritmética) se llaman operandos.

La operación (a realizar entre los dos operandos) está definida por un operador.

Operand Operator Operand
100 + 50

Añadiendo

El operador suma (+) suma números:

Ejemplo

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>

restando

El operador resta (-) resta números.

Ejemplo

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>

multiplicando

El operador multiplicación (*) multiplica números.

Ejemplo

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>

Divisor

El operador división (/) divide números.

Ejemplo

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>

Resto

El operador módulo (%) devuelve el resto de la división.

Ejemplo

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>

En aritmética, la división de dos números enteros produce un cociente y un resto.

En matemáticas, el resultado de una operación de módulo es el resto de una división aritmética.

incrementando

El operador increment (++) incrementa los números.

Ejemplo

let x = 5;
x++;
let z = x;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

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

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

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

</body>
</html>

Decrementando

El operador decremento (--) disminuye los números.

Ejemplo

let x = 5;
 x--;
let z = x;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

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

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

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

</body>
</html>

exponenciación

El operador exponenciación (**) eleva el primer operando a la potencia del segundo operando.

Ejemplo

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

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

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

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

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

</body>
</html>

x ** y produce el mismo resultado que Math.pow(x,y):

Ejemplo

let x = 5;
let z =
  Math.pow(x,2);

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Math.pow()</h2>

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

<script>
let x = 5;
document.getElementById("demo").innerHTML = Math.pow(x,2);
</script>

</body>
</html>

Precedencia del operador

La precedencia del operador describe el orden en el que se realizan las operaciones en una expresión aritmética.

Ejemplo

let x = 100 + 50 * 3;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Operator Precedence</h2>
<p>Multiplication has precedence over addition.</p>

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

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

</body>
</html>

¿El resultado del ejemplo anterior es igual a 150 * 3, o es igual a 100? + 150?

¿Se hace primero la suma o la multiplicación?

Como en las matemáticas escolares tradicionales, primero se hace la multiplicación.

La multiplicación (*) y la división (/) tienen mayor precedencia que suma (+) y resta (-).

Y (como en matemáticas escolares) la precedencia se puede cambiar usando paréntesis.

Cuando se utilizan paréntesis, se calculan las operaciones dentro de los paréntesis. primero:

Ejemplo

let x = (100 + 50) * 3;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Operator Precedence</h2>
<p>Multiplication has precedence over addition.</p>
<p>But parenthesis has precedence over multiplication.</p>

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

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

</body>
</html>

Cuando muchas operaciones tienen la misma precedencia (como suma y resta o multiplicación y división), se calculan de izquierda a derecha. bien:

Ejemplos

let x = 100 + 50 - 3;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Operator Precedence</h2>
<p>When many operations has the same precedence, they are computed from left to right.</p>

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

<script>
document.getElementById("demo").innerHTML = 100 + 50 - 3;
</script>

</body>
</html>

let x = 100 / 50 * 3;

Pruébelo usted mismo →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Arithmetic</h1>
<h2>Operator Precedence</h2>
<p>When many operations has the same precedence, they are computed from left to right.</p>

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

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

</body>
</html>

Nota

Para obtener una lista completa de los valores de precedencia de operadores, visite:

Valores de precedencia del operador de JavaScript.