How to get a random float in a range using JavaScript

With the help of three methods, Math.random(), and _.random(), and chance.floating(), we will discover how to get a random float in a range using JavaScript. You can use whatever method you like, and they are all relatively straightforward.

How to get a random float in a range using JavaScript

Using Math.random()

The Math.random() method does not need any argument. When called, it returns a random float number between zero and one, such as 0.6 or 0 but not 1. Its syntax and usage is declared here.

You can easily get a random float in a range when you declare max and min value to do calculations such as follows:

// Declare the min and max values
var min = 2020,
max = 2022;

// Get a random float in a range [2020,2022)
let res = Math.random() * (max - min) + min;
console.log(res);

Output:

2020.0528177598226

The logic behind this method is very simple. Suppose x is a random float received by using Math.random(); it will have the condition: 0<=x<1, and we multiply x with max minus min (in this case is 2022-2020 = 2), so it will be 0<=2x<2, and therefore, we just add them with the minimum value (2020), so we will receive a float number 2020<=2x+2020<2022, it will satisfy what you are looking for.

Using _.random()

This method needs to be imported from the lodash library. The easiest way of doing so is to declare this script in your Html document:

<script src="https://cdn.jsdelivr.net/npm/[email protected]/lodash.min.js"></script>

Syntax:

_.random(begin,end,isFloat)

Parameters:

• begin: The beginning of the range.
• end: The end of the range.
• isFloat: true indicates that we want the float instead of an integer (false).

This method would generate a random float in a range for you without needing to implement any other calculations. For instance:

<html>
<body>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/lodash.min.js"></script>
<script type="text/javascript">
// Get a random float in range between 2020 and 2022
let res = _.random(2020, 2022, true);
console.log(res);
</script>
</body>
</html>

Output:

2021.598182049444

As you can see, this method does not require any multiplication or subtraction. All you have to do is passing the number of the range begin and end, followed by a true boolean value to make it work. If you still want an easier way rather than these, then you should take a look at the next solution.

Using chance.floating()

This method needs to be imported from the chance library. To do so, please use the following script tag to import it:

<script src="https://chancejs.com/chance.js"></script>

Syntax:

chance.floating({min:begin,max:end})

Parameters:

• begin: The beginning of the range
• end: The end of the range

If you pay attention to the syntax, you will find that you have to declare the min and max value, which is the same as the beginning and ending value of the range you want to get a random float from. For example:

<html>
<body>
<script src="https://chancejs.com/chance.js"></script>
<script type="text/javascript">
// Get a random float in range between 2020 and 2022
let res = chance.floating({min: 2020, max: 2022});
console.log(res);
</script>
</body>
</html>

Output:

2021.2031

As can be seen, this approach also requires an external library like the second one. However, the float will be fixed to 4 digits in the decimal part; this is the difference between these methods.

Summary

This tutorial have guided you how to get a random float in a range using JavaScript. We suggest you use the first method, which doesn’t require any library. We hope you succeed with our tutorials.

Maybe you are interested: