Arithmetic Operations In JavaScript

In this tutorial, you will learn how to use arithmetic operators to perform arithmetic calculations in JavaScript.

As you probably already know, operators are used in JavaScript to modify the value of variables. They are used for changing the value of variables by performing mathematical computations.
They are helpful approaches to giving a variable a numerical value.

Numerical values are passed to an arithmetic operator as operands, and the outcome is always a single numerical value. These operands can either be literals or variables or a combination of both.
When the numbers are literals:

let x = 10 +20;
console.log(x); //30

When the operands are variables:

let x = y + z;

When both literals and variables are combined:

let x = (20 + 30) + a;

JavaScript arithmetic operators include the following:

Operator	Description
+	Addition
-	Subtraction
*	Multiplication
/	Division
**	Exponentiation
%	Modulus
++	Increment
--	Decrement

Addition Operator (+)

The addition operator adds numbers together and returns the sum as a result. Example

let sum = 10 + 30;
console.log(sum); //40

Here, we used the addition operator to add two literal numbers together. Let's add two variables next:

let a = 20;
let b = 30;
let sum = a + b;
console.log(sum); //50

What happens when either one or both operands are strings?

Let's see what the addition operator will do in any of these cases.
When both operands are strings, the second operand is concatenated to the first operand.

let a = "20";
let b = "30";
let sum = a + b;
console.log(sum); //2030

When one of the operands is a string and the other is a number. The number is converted into a string and the second operand is concatenated to it afterward.

let a = "30";
let b = 20;
let result = a + b;
console.log(sum);//3020 

When the values to be operated on are not straightforward numbers or strings like we have seen above, the table below shows us how the operation JavaScript handles them.

First Operand	Second Operand	Outcome	Explanation
+0	+0	+0	+0 + (+0) = +0
-0	+0	+0	+0 + (-0) = +0
-0	-0	-0	-0 + (-0) = -0
Infinite	Infinite	Infinite	Infinity + Infinity = Infinity
Infinite	-Infinite	NaN	Infinity + -Infinity = NaN
-Infinite	-Infinite	-Infinite	-Infinite + -Infinite = -Infinite

In the case where either value is NaN, the outcome will be NaN.

Subtration Operator (-)

This operator subtracts one number from another. Example:

let x = 30 - 20;
console.log(x); //10

Variables containing literal values can also be operated on. Example

let a = 30;
let b = 20;
let sub = a - b;
console.log(sub); //10

When the values to be operated on are not straightforward numbers like we have seen above, the table below shows us how the - operation JavaScript handles them.

First Operand	Second Operand	Outcome	Explanation
+0	+0	+0	+0 - (+0) = +0
-0	+0	-0	-0 - (+0) = -0
-0	-0	+0	-0 - (-0) = +0
Infinite	Infinite	NaN	Infinity - Infinity = NaN
Infinite	-Infinite	-Infinite	Infinity - (-Infinity) = -Infinite
-Infinite	-Infinite	NaN	-Infinite + (-Infinite) = NaN

Multiplication Operator (*)

The multiplication Operator * multiplies numbers. It multiplies two numbers and returns a number as output. Example:

let x = 20 * 30;
console.log(X); //600

It can operate on variables also.

let a = 10;
let b = 20;
let multi = a * b;
console.log(multi); // 200

When one operand or both are strings, JavaScript converts the string into a number and performs the multiplication operation. Example:

let x = "5";
let y = "4";
let result = x * y;

console.log(result); //20

In the case of special operands in the multiplication operation, the table below shows how Javascript handles them.

First Operand	Second Operand	Outcome	Explanation
+0	+0	+0	+0 * (+0) = +0
-0	+0	-0	-0 * (+0) = -0
-0	-0	+0	-0 * (-0) = +0
Infinite	0	NaN	Infinite * 0 = NaN
Infinite	Infinite	Infinite	Infinity * Infinity = Infinite
Infinite	-Infinite	-Infinite	Infinity * (-Infinity) = -Infinite
-Infinite	-Infinite	Infinite	-Infinite * (-Infinite) = Infinite

Division Operator (/)

This operator divides numbers. It divides the first operand into the second operand. Example:

let x = 30 / 5;
console.log(x); //6

We can have the operator operate on variables too.

let a = 30;
let b = 5;
let result = a / b;
console.log(result); //6

When one or both operands are strings, JavaScript converts the string into a number and performs the division operation.

let a = "30";
let b = 5;
let result = a / b;
console.log(result); //6

In the case of special operations, the table below shows how JavaScript handles them.

First Operand	Second Operand	Outcome	Explanation
0	0	NaN	0 / 0 = NaN
A number	0	Infinite	30 / 0 = Infinite
A number	Infinite	0	30 / Infinite = 0
Infinite	positive number	Infinite	Infinite / 30 = Infinite
Infinite	a negative number	-Infinite	Infinity / -30 = -Infinite

Exponenciation Operator (**)

This operator is the raised to power operator i.e., it raises the first operand to the power of the second operand. It multiplies the first operand by itself in the number of the second operand. Example:

let x = 6 ** 5;
console.log(x); //7776

The operation above multiplied 6 by 6 in 5 places. In simple terms, what happened is 6*6*6*6*6 = 7776.

When the operands are variables, this operator can still be used.

let a = 6;
let b = 5;
let result = a ** b;
console.log(result); //7776

The exponentiation operator performs the same operation as the Math.pow function.

let a = 6;
let b = 5;
let result = Math.pow(a,b); // result is 7776

So with the example above, we now know that a ** b will produce the same result as Math.pow(a,b).

Modulus Operator (%)

This operator is commonly known as remainder. The operator returns the remainder when one operand is divided by another.

let x = 30 % 20;
console.log(x) //10

In the operation above, 30 is divided by 20, and the remainder is returned as the result. 30 can be divided by 20 only once and the remainder is 10 and that is what we got as our result.
Variables can also be operated. Example:

let a = 30;
let b = 20;
let result = a % b;
console.log(result); //10

Increement Operator (++)

This operator is used to increment a number by 1.

If used postfix(operand before operator) a++, the operator returns the value before incrementing.

let a = 30;
let b = a++;
console.log(b); //30

If used prefix(operand after operator) ++a, the operator returns the value after incrementing.

let a = 30;
let b = ++a;
console.log(b);// 31

Decreement Operator (--)

This operator is used to decrease a number by 1.

If used postfix(operand before operator) a++, the operator returns the value before decreasing.

let a = 30;
let b = a--;
console.log(b); //30

If used prefix(operand after operator) ++a, the operator returns the value after decreasing.

let a = 30;
let b = --a;
console.log(b);// 29

Summary

Operator	Description	Explanation
+	Addition	Adds numbers together
-	Subtraction	Subtracts one number from another
*	Multiplication	Multiplies two numbers
/	Division	Divides one number by another
**	Exponentiation	Raises one number to the power of another
%	Modulus	Returns the remainder in a division operation
++	Increment	Increases a number by 1
--	Decrement	Decreases a number by 1

Conclusion

In this article, we discussed the arithmetic operators we have in JavaScript and how they are used.
Take your time to go through them slowly and understand each of them, because they will help you in your daily JavaSript tasks.

Thanks for reading and don't forget to drop your questions and observations in the discussion box.

---

Please leave a comment or tweet me if you have any questions or recommendations! Make sure to follow me on social media!

Comments

[David Emaye]

Nice Piece! Thanks for this

[Precious Longe]

You are welcome!