What is a Random Number?
The random number is the number generated by the computer system of any such devices which we cannot predict. Developers or the coder use this random number generation to fulfill their business needs. Programmatically, this number can be bounded within the specified range or without putting any boundaries of the range. In this topic, we are going to learn about Random Number Generation in JavaScript. In this topic, we are going to learn about the Random Number Generator in JavaScript.
Random Number in JavaScript
Almost every programming language has its built-in function to the same. JavaScript also has a function to get a random number. There is various way we can get the random number in JavaScript, let’s see with some example.
Use of random number
These random numbers can be used in various types of game-making codes. This can be used in a number guessing or prediction game. This can be used in the OTP (One Time Password) feature implementation. We are very well aware of the OTP we generally receive from various websites. That is also a random number, and that can be received by using the Random function of JavaScript.
Examples of Random Number Generator in JavaScript
Let us see some of the examples to generate random numbers:
1. Use of Math.random() function
We have the Math. random() function in JavaScript to deal with the random numbers. This number always return less than 1 as a result.
Code:
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Random Number</h2>
<p id="random_number"></p>
<script>
document.getElementById("random_number").innerHTML = Math.random();
</script>
</body>
</html>
Output:
This will always give the result in the form of a decimal point.
2. Get the random number in the form of an integer(complete number).
We can get this by extending the above function.
Code:
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Random Number</h2>
<p id="random_number"></p>
<script>
var randomNumber = Math.floor(Math.random() * 10);
document.getElementById("random_number").innerHTML = randomNumber;
</script>
</body>
</html>
Output:
The output of the above code will vary between 0 to 9. Since we have multiplied by 10, this will give the output always in a single digit.
3. Get the random number between 0 to 99.
Code:
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Random Number</h2>
<p id="random_number"></p>
<script>
var randomNumber = Math.floor(Math.random() * 100);
document.getElementById("random_number").innerHTML = randomNumber;
</script>
</body>
</html>
Output:
We will get a random number between 0 to 99. But most of the time, we will get the two digits numbers. For example – 68,45,34 etc.
4. How we can always more than equal to 1 as randomly generated numbers.
Since we know that normal Math.random() will give us a number between 0 to 1, we can multiply this by 10 and add 1 to get the number always greater or equals to 1.
Code:
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Random Number</h2>
<p id="random_number"></p>
<script>
var randomNumber = Math.floor(Math.random() * 10) + 1;
document.getElementById("random_number").innerHTML = randomNumber;
</script>
</body>
</html>
Output:
5. Get the random number on the basis of minimum and maximum numbers.
Yes, we will have a function with two-parameter, let’s say getRndInteger().
Code:
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Random Number</h2>
<p id="random_number"></p>
<script>
function getRndInteger(minimum, maximum) {
return Math.floor(Math.random() * (maximum - minimum)) + minimum;
}
document.getElementById("random_number").innerHTML = getRndInteger(10, 20);
</script>
</body>
</html>
Output:
getRndInteger(10, 20); // this will give us numbers between 10 to 20.
getRndInteger(1, 100); // this will give us numbers between 1 to 100.
Note: All the above code will be supported by – Google Chrome; Firefox; Opera mini; Safari etc.
6. The random function between 10 to 1000.
Code:
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Random Number</h2>
<p id="random_number"></p>
<script>
function getRndInteger(minimum, maximum) {
return Math.floor(Math.random() * (maximum - minimum)) + minimum;
}
document.getElementById("random_number").innerHTML = getRndInteger(10, 1000);
</script>
</body>
</html>
This code is very similar to the above one. We are calling here the same function with the different parameters.
Output:
7. Can I get a unique random number?
Yes, we can get a unique number. But we can’t call it truly random; we can call it truly unique. Not only using this but using the timestamp of JavaScript. We can generate this programmatically. We can store the already generated randomly in an array. We can compare the newly generated number with the already existing in the array if we exist in the array; wecan call the random function again to get the unique one.
Is it secure?
No, there is nothing to deal with the security. This is not encoded or decoded; it just generates the random number. We can take the benefit of this type of function in generating the OTP (One time password) of fixed length. So, we should avoid using this for security purposes. We can use this as an OTP generator function.
Now, it’s time to test yourself
1. In JavaScript, we can only get the random numbers of a specified range only? True or False?
2. JavaScript uses MATH library for built-in random function. True or False?
3. Can you write a program in JavaScript to print a random number between 50 to 100? You can take a hint from the above code check for getRndInteger(10, 20).
Conclusion – Random Number Generator in JavaScript
We should use the Radom feature while working with any programming language to handle various business requirements. The random function of JavaScript can be used to fulfill various kinds of business needs. We can use the same JavaScript output for server-side programming. For example, if we are using JavaScript with PHP, we can use this function in PHP to fulfill our programming needs. We can use this guessing game or the OTP-related kinds of stuff. We can use this to generate any specified number of random digits as we see in the multiple examples above. Also, we should avoid using this as encrypted as this is a plain random digit.