Lesson 5: Performing Arithmetic Operations

JavaScript is not just a scripting language, it can also perform arithmetic operations. On top of that, it can interact with online users by receiving data from them, operate on the data and then displays the output to the users. The four basic arithmetic operators in JavaScript are shown in the following table:

For example, 13%5=3 and 4**2=4²=16.

Let us construct our first arithmetic program in JavaScript. You can either use a text editor such as Notepad to type in the statements. You can also use Microsoft Frontpage or Dreamweaver to do the job. However, the best free editor I would recommend is Notepad++, which you can download from  https://notepad-plus-plus.org/ .

Example 5.1 A Simple Arithmetic Program

<Script>
var           Number1, // this is the first string input by the user
Number2 , // this is the second string input by the user
Num1 , // numeric value converted from Number1
Num2, // numeric value converted from Number2
sum,
difference ,
product,
quotient;
Number1=window.prompt("Enter your first Integer","0");
Number2=window.prompt("Enter your second integer","0");
Num1=parseInt(Number1);
Num2=parseInt(Number2);
sum=Num1+Num2;
difference=Num1-Num2;
product=Num1*Num2;
quotient=Num1/Num2;
document.getElementById('sum').innerHTML=sum
document.getElementById('difference').innerHTML=difference;
document.getElementById('product').innerHTML=product;
document.getElementById('quotient').innerHTML=quotient;
</Script>

Click the Start button initiate the calculation.

The Answers

The sum is 
The difference is 
The product is 
The quotient is 

Let's me explain a bit on the JavaScript codes in Example 5.1. The term document refers to the document object. When a web page is loaded into a browser, it becomes a document object. The document object has methods and properties. The methods we used here is getElementById, which means it returns the element that has the ID attribute with the specified value. The innerHTML property can be used on any element. It is used to replace or retrieve contents in an element. For example, the strong element has the ID of sum, so it is replaced by the value of the sum computed by the JavaScript.