Compute Average of an Array After Mapping Each Element in JavaScript

Computing the average of an array after mapping each element to a value in JavaScript can be done by using the forEach() loop, the parseInt() method, the reduce() method, and the for..of loop. In this article, we are going to fetch all the values from an array and after mapping each element to a numerical value we will calculate its sum thus to compute its average.

Given below is an array consisting of values. We will compute the average by summing up the values and then dividing it by the number of values available.

Suppose

Input is: [1, 2, 3, 4, 5]
Result is: 3
Explanation: (1+2+3+4+5)/5 = 3

Input is: [2, 4, 7, 9, 1, 3, 8]
Result is: 4.85
Explanation: (2+4+7+9+1+3+8)/7 = 4.85

Table of Content

Computing the average of an array can be done in the following ways:

• Using foreach() loop
• Using for loop with ParseInt() method
• Using reduce() method
• Using for?of Loop

Using foreach() loop

Using foreach() loop we can do it in the following steps:

• We will iterate over the list of elements using the forEach() loop.
• On iterating each element, we will convert it to a value and add it to a sum.
• Once we get the sum of all numbers, we will divide it by the total numbers.

Example

In the below example, we are computing the average of an array after finding the sum of all the values.

arr = [1, 2, 3, 4, 5];
// Computing the average
function avg(arr) {
    var sum = 0;
    // Iterate over the elements of the array
    arr.forEach(function (item, idx) {
    //Adding the elements to the sum
    sum += item;
    });
    // Returning the average of the numbers
    return sum / arr.length;
}
console.log("Average of all the numbers is: "+avg(arr));

Output

Average of all the numbers is: 3

Using for loop with ParseInt() method

In this approach we will use the parseInt() method for mapping the values to a number in the following ways:

• We will iterate over the list of elements using the for() loop.
• Use parseInt() to parse the numbers in the desired decimal type.
• Store the sum of numbers in a variable.
• Find the sum of all the numbers by using the below formula
average=sum/lengthofnumbers

Example

In the below example, we are computing the average of an array after finding the sum of all the values. We apply to parseInt() to find the sum of all values.

arr = [2, 4, 7, 9, 1, 3, 8];
var sum = 0;
// Iterating the elements by using the for loop
for (var i = 0; i < arr.length; i++) {
    // Store the sum of all numbers in a variable
    sum += parseInt(arr[i], 10);
}
// Calculating the Average
var avg = sum / arr.length;
console.log("Average is: " + avg);

Output

Average is: 4.857142857142857

Using reduce() method

In this approach, we will use reduce() in the following steps:

• In this method, we take two numbers from the array and replace them with their sum.
• The reduce() method gives us one value, which is the total of all the numbers in the array.
• We save this total in a variable called sum.
• To find the average of all the elements, we divide the sum by the number of elements in the array.

Example

The following is a simple example of computing the average of an array using reduce() method.

var arr = [4, 8, 12, 16];

// Using reduce to calculate the sum directly
var sum = arr.reduce((a, b) => a + b);

// Calculating the average of the numbers
var avg = sum / arr.length;

console.log(avg);

Output

Average is: 10

Using for?of Loop

In this approach, we will use for..of loop in the following steps:

• In this method, we go through each item in the array using a for?of loop to find the total sum of the elements and then calculate the average.
• We start by setting a variable called total to 0 to hold the total.
• The for?of loop looks at each item in the array one by one.
• During each loop, we add the value of the current item to the total.
• Once we have iterate through all the items, we find the average by dividing the total sum by the number of items in the array.

Example

The following is a simple example of computing the average of an array using for..of loop.

// Define the array
let arr = [10, 15, 20, 25, 30];

// Function to calculate the average using for...of loop
function calculateAverage(array) {
    let total = 0;
    
    // Iterate over the elements of the array
    for (let num of array) {
        total += num;
    }
    
    // Calculate the average
    return total / array.length;
}

// Call the function and log the output
console.log("The average is: " + calculateAverage(arr));

Output

The average is: 20

Conclusion

In this article, we have seen simple methods of computing the average of an array after mapping each element to a value. We have implemented it by using methods such as the forEach() loop, the parseInt() method, the reduce() method, and the for..of loop. All methods are simple and efficient to use.