JavaScript Arithmetic Operators and Operands

JavaScript Arithmetic Operators:

Arithmetic operators perform operation on numbers (literals or variables).
  • Addition (+)
  • Subtraction (-)
  • Multiplication (*)
  • Exponentiation (ES2016) (**)
  • Division (/)
  • Modulus (Remainder) (%)
  • Increment (++)
  • Decrement (--)
A typical arithmetic operation operates on two numbers.
The two numbers can be literals:

<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 100 + 10; 
document.getElementById("example").innerHTML = a; 
</script>

Result:
110
or variables with value:
<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var x = 100; 
var y = 10; 
var z = x + y; 
document.getElementById("example").innerHTML = z; 
</script>

Result:
110
or directly with expressions:
<!DOCTYPE html> 
<html> 
<body> 
<p id="example">
</p> 
</body> 
</html>
<script> 
var a = 3; 
var b = (10 + 5) * a; 
document.getElementById("example").innerHTML = b; 
</script> 

Result:
45

Operators and Operands:

The numbers used in an arithmetic operation are called operands. Which Operation to be performed between the two operands is defined by an operator.
a + b // here a, b Operands and + Operator.
Adding Operator (+):
<!DOCTYPE html> 
<html> 
<body> 
<h2>Adding Operator (+)</h2> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 10; 
var b = 2; 
var c = a + b; 
document.getElementById("example").innerHTML = c; 
</script>
Subtraction Operator (-):
<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 15; 
var b = 10; 
var c = a - b; 
document.getElementById("example").innerHTML = c; 
</script>
Multiplication Operator (*):
<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 15; 
var b = 5; 
var c = a * b; 
document.getElementById("example").innerHTML = c; 
</script>
Division Operator (/):
<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 15; 
var b = 3; 
var c = a / b; 
document.getElementById("example").innerHTML = c; 
</script>
Modulus Operator (%):
It returns the division remainder.
<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 7; 
var b = 2; 
var c = a % b; 
document.getElementById("example").innerHTML = c; 
</script>

Result:
1
Increment Operator (++):
<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 10; 
a++; 
var b = a; 
document.getElementById("example").innerHTML = b; 
</script>

Result:
11
Decrement Operator (--):
<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 10; 
a--; 
var b = a; 
document.getElementById("example").innerHTML = b; 
</script>
Exponentiation Operator (**):
(**) is called exponentiation operator that raises the first operand to the power of the second operand.
<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 10; 
document.getElementById("example").innerHTML = a ** 2; 
</script>

Result:
100
Exponentiation Operator (**) produces the same result as Math.pow(x,y):
<!DOCTYPE html> 
<html> 
<body> 
<p id="example"></p> 
</body> 
</html> 
<script> 
var a = 10; 
document.getElementById("example").innerHTML = Math.pow(a,2); 
</script>

Result:
100

Project Source Code:
<!DOCTYPE html> 
<html> 
<body> 
<h2>JavaScript Operators</h2> 
<p><b style="color: red"> Arithmetic operators used by JavaScript ( + - * / )</b> to compute values (just like algebra).</p> 
<p id="example"></p> 
</body> 
</html> 
<script type="text/javascript"> 
document.getElementById("example").innerHTML = (6 - 3) / 2;// any arithmetical operation can be done using js arithmetic operators 
</script>


EmoticonEmoticon