Fill an Array with Random Numbers using JavaScript

To fill an array with random numbers, you can use the built-in Array.map() method in combination with the Math.random() method.

You can do it in the following steps:

1. Create an array of the given size using the Array() constructor.
2. Fill the array with some temporary values using the Array.fill() method.
3. Use the Array.map() method to call a mapping function on each array element.
4. Replace each array element with a random number using the Math.random() method.

The following example creates an array of size 10 and fills each slot with a random number. The random numbers can be between 0 to 50.

const size = 10;
const maxNum = 50;

const arr = new Array(size) // Create array of size 10
            .fill(0)        // Fill each slot with 0
            .map(()=>Math.floor(Math.random()*maxNum));

console.log(arr);
// Output: [30, 29, 26, 32, 6, 19, 15, 40, 10, 29]

In the above example, we first created an array of size 10 using the Array() constructor.

The Array() constructor creates a new instance of an array. If you pass a single parameter to it, it creates an array of that size with empty slots.

But, if you pass multiple parameters, it creates an array of those elements.

console.log(new Array(10))
// Output: [empty × 10]

console.log(new Array(10, 20, 30));
// Output: [10, 20, 30]

In the second step, we filled the array with zeros. This is needed because we have to apply the map() function on each array item in the next step.

The Array.fill() method fills each slot of the array with the specified value and returns the modified array.

const arr = new Array(10);

console.log(arr.fill(0));
// Output: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]

console.log(arr.fill(5));
// Output: [5, 5, 5, 5, 5, 5, 5, 5, 5, 5]

To generate the random numbers, we can use the Math.random() method. The Math.random() method returns a floating-point number from 0 to 1(exclusive).

console.log(Math.random());  // 0.76
console.log(Math.random());  // 0.03
console.log(Math.random());  // 0.69

But, we don’t want to fill the array with floating-point numbers. Instead, we want to fill it with integer values from 0 to 50.

Therefore, we first multiplied the randomly generated number by the maximum number we want to generate and then converted it to an integer value using the Math.floor() method.

The Math.floor() method rounds down the given number to its nearest integer. If it’s already an integer, it remains the same.

const maxNum = 50;

console.log(Math.floor(Math.random()*maxNum));  // 24
console.log(Math.floor(Math.random()*maxNum));  // 3
console.log(Math.floor(Math.random()*maxNum));  // 48

Method 2: Using the Array.from() Method

We can also use the Array.from() method to fill an array with random numbers. The main advantage of this method is that we don’t have to explicitly call the map() method on each array element.

See the following example:

const size = 10;
const maxNum = 50;

const arr = Array.from(
    {length: size},  // specify array size
    ()=> Math.floor(Math.random()*maxNum) // generate random numbers
);

console.log(arr);
// Output: [19, 31, 20, 33, 49, 47, 44, 12, 30, 20]

Method 3: Using the Array.push() Method

This is the most basic approach to fill the array with random numbers.

In this method, we one by one generate a random number and then push it to the array using the push() method.

const size = 10;
const maxNum = 50;

// Create an empty array
const arr = [];

for(let i=0;i<size;i++){
    
    // Generate a random number
    let randomNum = Math.floor(Math.random()*maxNum);
    
    // Push the number to the array
    arr.push(randomNum);
}

console.log(arr);
// Output: [34, 12, 23, 43, 34, 39, 23, 27, 47, 30]

Thanks for reading.