In this article, We will make some programs to perform basic mathematical operations like add two numbers, swap two numbers and find square root in our JavaScript. We will see these three programs one by one to understand from very basic.
These will be our basic programs, so that we can understand that how we can perform such kind of arithmetic operation in JavaScript. So without wasting more time, let’s jump into it.
Adding Two Numbers
So our first program will be to add two number, As we know that JavaScript cannot show it content without HTML. So we need to add HTML as well here, like we will just use it to show our output.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Addimg two numbers</title>
</head>
<body>
<script>
var a = 20;
var b = 40;
document.write("The addition between a and b will be"+ (a+b));
</script>
</body>
</html>Firstly, we have made an HTML file, in which we have just basic structure, we don’t need to touch that. We will just move to a body part, in this we have used the <script> tag to add the JavaScript code. In here, we have add variable a with 20 value, and variable b with 40 value. So, addition of these should be 60, we have here use document.write() method to show the output. We can also use alert() and, butconsole.log() these methods don’t show the output on the DOM or simply on screen, so document.write() is good here.
Note that: We are using here inner JavaScript code here, you can also write this code in the other file with .js extension and just add the path in the <script> tag’s src attribute.
Getting Data From User and Perform Addition
You can also add to numbers which are dynamic, or you can say data provided by user. For that, we just need to provide fields in which the user can enter the values. Here, we have used a prompt method in which we have added a message, Similarly we have added another prompt for b variable with the message. These prompt will pop up when the program will get loaded and simply show these messages. If users add some value, then that value will come as string. Now we have declared another variable named c, in this we have, firstly, converted the string value to integer using parseInt() the method. Then we have performed addition between these two.
<script>
var a = prompt("Please enter first number ");
var b = prompt("Please enter second number ");
var c = parseInt(a) + parseInt(b);
document.write("Addition will be "+c);
</script>
Swapping Two Numbers
Next program will be swapping two numbers, Here we have again made the same HTML structure and added a <script> tag to add JavaScript. Here we have again added two variable a and b with some values. Then we printed the value of these, also we have used </br> which is actually a tag to provide new line to HTML DOM.
Now we have declared another variable named c. In this variable, we have assigned the value of a so c will 20, and a will have nothing in it. Then we have assigned the value of b to a, so a will be 40 and b will be empty. Lastly, we have assign to value of c to b, so b will be 20 and c will be empty. Hence, swap will be done, and just printed the result of the swapped value.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Addimg two numbers</title>
</head>
<body>
<script>
var a = 20;
var b = 40;
document.write("Before: a and b will be "+a+ " and " +b+ " </br>");
var c;
c=a;
a=b;
b=c;
document.write("After: a and b will be "+a+" and "+b)
</script>
</body>
</html>
Fetching Values From User to Swap
We will use similar method like using prompt to get values and using parseInt to convert String to Integer. Here you can see we have used prompt inside the parseInt, which can be also done in addition one. Here we will get integer directly in our variables.
<script>
var a = parseInt(prompt("Please enter first value "));
var b = parseInt(prompt("Please enter second value "));
document.write("Before: a and b will be "+a+ " and " +b+ " </br>");
var c;
c=a;
a=b;
b=c;
document.write("After: a and b will be "+a+" and "+b)
</script>Finding The Square Root of The Number
Now, lastly, we will find the square root of the number. First, we will again create the same HTML structure with <script> tag. To find out the square root of the number, we have created a variable named a with 64 value. Now we have added another variable named b in which we will catch the value of square root of a. In here, we will use the Math which is actually an object, and using this we can access math class’s methods and properties. We have used Math.sqrt(a) a method which will return the square root value of a.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Addimg two numbers</title>
</head>
<body>
<script>
var a = 64;
var b = Math.sqrt(a);
document.write("Square root of "+a+" will be "+b);
</script>
</body>
</html>
Fetching Value From User
Here again we just use prompt and parseInt method to get the values as an integer, and then we just apply our previous formula to get the result.
<script>
var a = parseInt(prompt("Please enter value "));
var b = Math.sqrt(a);
document.write("Square root of "+a+" will be "+b)
</script>
