JavaScript For Fun: Number

Understanding the fundamental concept of Number type Variables

Image is taken from Pexels

JavaScript is one of the most popular programming languages in this modern tech century. So why it is so popular? Hmm… A very common question. I will take about it in another day. Let's jump into the number type variable or in short form var.

There are various types of variables, one of them is Numeric or number. Suppose var data= 12; is a number. You can say hah…I can see that. so what is the evidence? In that case, we need typeof. Let’s check it out.

var data = 12;
console.log(typeof price)
//expected output number

Now you have one job to do. Check the output of var data = “12”. You will get it clear.

Let's check it for multiple values

var data1 = 5;
var data2 = 2;
var total = data1 +data2;
console.log(total)
//exepcted output 7

But if we make a string value then what will happen? Let's find out.

var data1 = 5;
var data2 = 2;
var total = data1 +data2;
console.log(total)
//exepcted output .... you will find out.

So why this happened? In string (another type of variables) when you add two or multiple string values with (+) it will add one after another. Let's see.

var data1 = "Hello";
var data2 = "World";
var total = data1 + data2;
console.log(total)
//expected output HelloWorld

But where is space? Because we didn't add it. So let's make it shinier.

var data1 = "Hello";
var data3 = "World";
var data2 = " "
var total = data1 + data2 + data3;
//or
var total = data1 + " " + data3
console.log(total)
// expected output
Hello World 
Hello World

Ok, skip this. Now focus on “12” / “21.50” this type of string. Is there any way to convert it to integer or float value? Yes!! possible. But before we do let’s know what is integer and float. Integers and Floats are two different kinds of numerical data. An integer or short format int is a number without a decimal point. A Float is a floating-point number, which means it is a number that has a decimal place (hints from processing.org).

Now, back on track. So how it is possible. For this we need parseInt() and parseFloat() function. (Function is a self-contained method where it takes data as input, after processing it will give the result.) Let's see how to do that.

var data = "21.50";
var int = parseInt(data);
var float = parseFloat(data);
console.log("Integer value: ", int);
console.log("Float value: ", float);
//expected output
 
Integer value:  21
Float value:  21.5

You can even convert a float value to an integer value (try it yourself). But can we do that for integers to float in the same way? Nah… you cant. but there is another function to call, that is toFixed(). Let's check it out.

var data = 20;
var float = parseFloat(data).toFixed(2);
//(2)working as decimal limit that rounding to keep the number into two decimals
console.log("Float value: ", float);
//expected output
Float value:  20.00

There is another way to convert a string into a number

var data = "20";
data =  + data;
console.log(data);
//We believe in evidance. For that we will check the variable type
console.log(typeof data);
//expected output 
20
number

Is there any way to convert a number into a string. Yes… Just add an empty string before the number/ variable name

var data = 20;
var data = " " + data;
console.log(data);
console.log(typeof data);
//expected output
20
string

Wow. you did it so far. That’s amazing, but we are not finished yet. Let’s check some Math functions.

Now focus on Absolute value. So there might be a negative number in the variable like “- 2 / -20.52”. How can we get the absolute value from it? For this, we have Math.abs(). Process same as always.

var data = -20;
var data = Math.abs(data);
console.log(data);
//expected output 20

To remove the decimal from the number and make it a round figure we will use Math.round().

var data = -20.25;
var data = Math.abs(data);
console.log(data);
//expected output -20

But there is a thing in here. If the decimal value is less than 0.50 it decrease and if greater than or equivalent 0.50 it will increase. Let’s have a look.

var data1 = 20.50;
var data2 = 20.49;
var greaterOrEven = Math.round(data1);
var lessThan = Math.round(data2);
console.log(greaterOrEven);
console.log(lessThan);
//expected output 
21
20

Now your work is to check it for a negative value.

If we want to increase the value, it doesn't matter if the decimal is greater or less the 0.50, then we will use Math.ceil() function. Let's have a look.

var data1 = 20.51;
var data2 = 20.49;
var greaterOrEven = Math.ceil(data1);
var lessThan = Math.ceil(data2);
console.log(greaterOrEven);
console.log(lessThan);
//expected output
21
21

The same procedure but it is the reverse of Math.celi() is Math.floor().

var data1 = 20.51;
var data2 = 20.49;
var greaterOrEven = Math.floor(data1);
var lessThan = Math.floor(data2);
console.log(greaterOrEven);
console.log(lessThan);
//expected output
20
20

If we want to generate a random value then we will use Math.random().

var data = Math.random();
console.log(data);

To find the minimum or maximum number between some of the variables we will use Math.min() and Math.max(). Let’s have a look.

var data1 = -5;
var data2 = 43;
var data3 = 100;
var minimum = Math.min(data1, data2, data3);
var maximum = Math.max(data1, data2, data3);
console.log("Minimum value: ",minimum);
console.log("Maximum value: ",maximum);
//expected output
Minimum value:  -5
Maximum value:  100

Amazing. Today we learned so many things. before saying goodbye we will implement our today's learning to make a small Lottery ticket generator. So why be late let’s get jump into it.

var number = Math.random() * 1000000000;
var lotteryTicketNumber = parseInt(number);
console.log(lotteryTicketNumber);

Tada!!!! Simple, right? So, there you have it. thank you for your time and happy coding.