JavaScript : Arithmetic Operators

Last update on August 19 2022 21:51:09 (UTC/GMT +8 hours)

Arithmetic Operators : +, -, *, /

In JavaScript, arithmetic operators take numerical values (either literals or variables) as their operands and return a single numerical value. There are four standard arithmetic operators, addition (+), subtraction (-), multiplication (*), and division (/).

These operators work as they do in other programming languages except the division (/) operator which returns a floating-point division in JavaScript, not a truncated division as it does in languages such as C or Java.

For example:
1/2 returns 0.5 in JavaScript.
1/2 returns 0 in Java.

In addition, JavaScript provides modules(%), increment(++), decrement(--) and unary negation(-) operators.

Example : ( + addition operator)

HTML Code:

<!doctype html>
<head>
<meta charset="utf-8">
<title>JavaScript + operator example</title>
<meta name="description" content="This document contains
an example of JavaScript + operator" />
</head>
<body>
<script src="addition_example1.js"></script>
</body>
</html>

JS Code:

var var1 = 45;
var var2 = 78;
var var3 = 45.10;
var var4 = 178.12;
var newvar  = var1 + var2;
var newvar1 = var3 + var4;
var newParagraph3 = document.createElement("p");
var newText3 = document.createTextNode("var1 + var2 = "+newvar+" and var3 + var4 = "+newvar1);
newParagraph3.appendChild(newText3);
document.body.appendChild(newParagraph3);

View the example in the browser

Example: ( - subtraction operator)

HTML Code:

<!doctype html>
<head>
<meta charset="utf-8">
<title>JavaScript subtraction operator example </title>
<meta name="description" content="This document contains an
example Using JavaScript subtraction operator"/>
</head>
<script src="subtraction-example1.js"></script>
</body>
</html>

JS Code:

var var1 = 45;
var var2 = 78;
var str1 = "w3resource";
var str2 = ".com";
var newvar = var1 - var2;
var newstr = str1 - str2;
var varstr = var1 - str2;
var newParagraph = document.createElement("p");
var newText = document.createTextNode("var1 -var2 = "+ newvar);
newParagraph.appendChild(newText);
document.body.appendChild(newParagraph);
var newParagraph1 = document.createElement("p");
var newText1 = document.createTextNode("str1 - str2  = "+ newstr);
newParagraph1.appendChild(newText1);
document.body.appendChild(newParagraph1);
var newParagraph2 = document.createElement("p");
var newText2 = document.createTextNode("var1 - str2  = "+ varstr);
newParagraph2.appendChild(newText2);
document.body.appendChild(newParagraph2)

View the example in the browser

Example : ( * multiplication operator)

HTML Code:

<!doctype html><head>
<meta charset="utf-8">
<title>JavaScript multiplication operator (*) example with DOM
</title>
<meta name="description" content="This document contains an example
Using JavaScript multiplication operator (*) with dom"/>
</head>
<body>
<script src="multiplication-example1.js"></script>
</body>
</html>

JS Code:

var var1 = 45;
var var2 = 78;
var var3 = 45.10;
var var4 = 178.12;
var newvar  = var1 * var2;
var newvar1 = var3 * var4;

var newParagraph = document.createElement("p");
var newText = document.createTextNode("var1 * var2 = "+ newvar);
newParagraph.appendChild(newText);
document.body.appendChild(newParagraph);

var newParagraph1 = document.createElement("p");
var newText1 = document.createTextNode("var3 * var4  = "+ newvar1);
newParagraph1.appendChild newText1);
document.body.appendChild(newParagraph1);

View the example in the browser

Example: ( / division operator)

HTML Code:

<!doctype html>
<head>
<meta charset="utf-8">
<title>JavaScript / operator example </title>
<meta name="description" content="This document contains an example of JavaScript division operator" />
</style>
</head>
<body>
<script src="division-example1.js"></script>
</body>
</html>

JS Code:

var var1 = 45;
var var2 = 78;
var var3 = 1;
var var4 = 2;
var newvar  = var1 / var2;
var newvar1 = var3 / var4;

var newParagraph = document.createElement("p");
var newText = document.createTextNode ("var1 / var2 = "+ newvar);
newParagraph.appendChild(newText);
document.body.appendChild(newParagraph);

var newParagraph1 = document.createElement("p");
var newText1 = document.createTextNode("var3 / var4  = "+ newvar1);
newParagraph1.appendChild(newText1);
document.body.appendChild(newParagraph1);

View the example in the browser

Practice the example online

See the Pen javascript-common-editor by w3resource (@w3resource) on CodePen.

Previous: Read from and write to HTML document
Next: JavaScript: Arithmetic Special Operators (%, ++, --, - )